boldkit/index.html at main · ANIBIT14/boldkit · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-8FRLPTZX87"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'G-8FRLPTZX87');
    </script>

    <!-- Primary Meta Tags -->
    <title>BoldKit - Neubrutalism UI Components for React & Vue 3 | 50+ Components, 15 Blocks & 42 Shapes</title>
    <meta name="title" content="BoldKit - Neubrutalism UI Components for React & Vue 3 | 50+ Components, 15 Blocks & 42 Shapes" />
    <meta name="description" content="Free neubrutalism component library for React and Vue 3 with 50+ UI components, 15 section blocks, 6 templates, and 42 SVG shapes. Built on shadcn/ui with thick borders, hard shadows, and bold colors. Install via shadcn CLI or shadcn-vue. Open source, accessible, TypeScript." />
    <meta name="keywords" content="neubrutalism, neubrutalism ui, neubrutalism components, neubrutalism react, neubrutalism vue, Vue 3 components, brutalism design, brutalist ui, React components, React UI library, Vue UI library, shadcn components, shadcn-vue, shadcn ui, Tailwind CSS components, TypeScript components, design system, open source ui, Radix UI, Reka UI, accessible components, dark mode components, neubrutalism shapes, SVG shapes, bold ui, thick borders, hard shadows, section blocks, landing page blocks, auth forms, hero section, feature grid, testimonials, marketing blocks, application blocks" />
    <meta name="author" content="Aniruddha Agarwal" />
    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
    <meta name="language" content="English" />
    <meta name="revisit-after" content="3 days" />
    <meta name="rating" content="general" />
    <meta name="distribution" content="global" />

    <!-- Canonical URL -->
    <link rel="canonical" href="https://boldkit.dev/" />

    <!-- Favicon -->
    <link rel="icon" type="image/png" href="https://ik.imagekit.io/fincalfy/Screenshot%202026-03-21%20at%209.48.00%E2%80%AFPM.png" />
    <link rel="apple-touch-icon" href="https://ik.imagekit.io/fincalfy/Screenshot%202026-03-21%20at%209.48.00%E2%80%AFPM.png" />

    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://boldkit.dev/" />
    <meta property="og:title" content="BoldKit - Neubrutalism UI Components for React & Vue 3" />
    <meta property="og:description" content="Free neubrutalism component library for React and Vue 3 with 50+ components, 15 section blocks, 6 templates, and 42 SVG shapes. Thick borders, hard shadows, bold colors. Built on shadcn/ui. Install via CLI." />
    <meta property="og:image" content="https://ik.imagekit.io/fincalfy/Screenshot%202026-03-21%20at%209.48.00%E2%80%AFPM.png" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:image:alt" content="BoldKit - Neubrutalism Component Library for React and Vue 3" />
    <meta property="og:site_name" content="BoldKit" />
    <meta property="og:locale" content="en_US" />

    <!-- Twitter -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:url" content="https://boldkit.dev/" />
    <meta name="twitter:title" content="BoldKit - Neubrutalism UI Components for React & Vue 3" />
    <meta name="twitter:description" content="Free neubrutalism component library for React and Vue 3 with 50+ components, 15 section blocks, 6 templates, and 42 SVG shapes. Thick borders, hard shadows, bold colors. Built on shadcn/ui." />
    <meta name="twitter:image" content="https://ik.imagekit.io/fincalfy/Screenshot%202026-03-21%20at%209.48.00%E2%80%AFPM.png" />
    <meta name="twitter:creator" content="@boldkitdev" />

    <!-- Theme Color -->
    <meta name="theme-color" content="#f87171" />
    <meta name="msapplication-TileColor" content="#f87171" />

    <!-- Structured Data (JSON-LD) - Software Application -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "SoftwareApplication",
      "name": "BoldKit",
      "alternateName": "BoldKit UI",
      "description": "A free, open-source neubrutalism component library for React and Vue 3 with 50+ UI components, 15 section blocks, 6 full-page templates, and 42 SVG shapes. Built on shadcn/ui featuring thick borders, hard shadows, and bold colors.",
      "url": "https://boldkit.dev",
      "applicationCategory": "DeveloperApplication",
      "applicationSubCategory": "UI Component Library",
      "operatingSystem": "Cross-platform",
      "offers": {
        "@type": "Offer",
        "price": "0",
        "priceCurrency": "USD",
        "availability": "https://schema.org/InStock"
      },
      "author": {
        "@type": "Person",
        "name": "Aniruddha Agarwal",
        "email": "aniruddha@boldkit.dev",
        "url": "https://www.linkedin.com/in/aniruddhaagarwal/"
      },
      "license": "https://opensource.org/licenses/MIT",
      "programmingLanguage": ["TypeScript", "JavaScript", "React", "Vue", "JSX", "TSX", "SFC"],
      "softwareVersion": "2.6.0",
      "downloadUrl": "https://github.com/ANIBIT14/boldkit",
      "installUrl": "https://boldkit.dev/docs/installation",
      "screenshot": "https://ik.imagekit.io/fincalfy/Screenshot%202026-03-21%20at%209.48.00%E2%80%AFPM.png",
      "featureList": [
        "50+ UI Components",
        "15 Section Blocks",
        "6 Full-Page Templates",
        "42 SVG Shapes",
        "10 Chart Types",
        "React Support",
        "Vue 3 Support",
        "Neubrutalism Design",
        "shadcn/ui Compatible",
        "shadcn-vue Compatible",
        "Tailwind CSS v4",
        "TypeScript Support",
        "Dark Mode",
        "Accessible via Radix UI & Reka UI",
        "shadcn CLI Install"
      ],
      "keywords": "neubrutalism, neubrutalism ui, brutalist design, React components, Vue 3 components, shadcn, shadcn-vue, Tailwind CSS, TypeScript, UI library, section blocks, marketing blocks, application blocks"
    }
    </script>

    <!-- Structured Data (JSON-LD) - WebSite for Search -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "WebSite",
      "name": "BoldKit",
      "url": "https://boldkit.dev",
      "description": "Neubrutalism component library for React and Vue 3",
      "potentialAction": {
        "@type": "SearchAction",
        "target": "https://boldkit.dev/components/{search_term_string}",
        "query-input": "required name=search_term_string"
      }
    }
    </script>

    <!-- Organization Schema -->
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "Organization",
      "name": "BoldKit",
      "url": "https://boldkit.dev",
      "logo": "https://ik.imagekit.io/fincalfy/Screenshot%202026-03-21%20at%209.48.00%E2%80%AFPM.png",
      "sameAs": [
        "https://github.com/ANIBIT14/boldkit",
        "https://www.linkedin.com/in/aniruddhaagarwal/"
      ],
      "contactPoint": {
        "@type": "ContactPoint",
        "email": "aniruddha@boldkit.dev",
        "contactType": "customer support"
      }
    }
    </script>

    <!-- Google Fonts: Bebas Neue + DM Mono -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Mono:wght@300;400;500&display=swap" rel="stylesheet" />

    <!-- Preconnect to external domains -->
    <link rel="preconnect" href="https://ik.imagekit.io" />
    <link rel="dns-prefetch" href="https://ik.imagekit.io" />
    <link rel="preconnect" href="https://www.googletagmanager.com" />
    <link rel="preconnect" href="https://www.google-analytics.com" />

    <!-- Web App Manifest hint -->
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="default" />
    <meta name="apple-mobile-web-app-title" content="BoldKit" />
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>