@boldkit
Free, open-source neubrutalism UI library supporting both React and Vue 3/Nuxt, installable via the shadcn CLI. Contains 56+ components, 15 section blocks, 7 full-page templates, 64 SVG shapes, and 14 chart types. Distinctive aesthetic: thick borders, hard shadows, and bold accent colors. Built on shadcn/ui (Radix UI) and shadcn-vue (Reka UI), Tailwind CSS v4, TypeScript. Use for: projects requiring a bold neubrutalism visual identity across both React and Vue stacks without switching libraries.
Install this registry
npx shadcn@latest add https://boldkit.dev/r/registry.json pnpm dlx shadcn@latest add https://boldkit.dev/r/registry.json bunx shadcn@latest add https://boldkit.dev/r/registry.json curl -s https://boldkit.dev/r/registry.json Components
94 totalBoldKit neubrutalism theme with bold colors and CSS variables
npx shadcn@latest add https://boldkit.dev/r/theme.json Utility functions for className merging
npx shadcn@latest add https://boldkit.dev/r/utils.json Theme provider hook with light/dark/system support and localStorage persistence. Used by Sonner toast for theme-aware rendering.
npx shadcn@latest add https://boldkit.dev/r/use-theme.json Error boundary wrapper with neubrutalism-styled fallback UI. Used by math-curve components to catch runtime errors gracefully.
npx shadcn@latest add https://boldkit.dev/r/error-boundary.json A vertically stacked set of interactive headings with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/accordion.json Displays a callout for user attention with bold neubrutalism borders
npx shadcn@latest add https://boldkit.dev/r/alert.json Displays content within a desired ratio
npx shadcn@latest add https://boldkit.dev/r/aspect-ratio.json An image element with a fallback for representing the user
npx shadcn@latest add https://boldkit.dev/r/avatar.json Displays a badge or a component that looks like a badge with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/badge.json Displays the path to the current resource using a hierarchy of links
npx shadcn@latest add https://boldkit.dev/r/breadcrumb.json Displays a button with neubrutalism styling and press-down animation
npx shadcn@latest add https://boldkit.dev/r/button.json Displays a card with header, content, and footer with thick borders and shadows
npx shadcn@latest add https://boldkit.dev/r/card.json A control that allows the user to toggle between checked and not checked
npx shadcn@latest add https://boldkit.dev/r/checkbox.json An interactive component which expands/collapses a panel
npx shadcn@latest add https://boldkit.dev/r/collapsible.json Searchable dropdown built by composing Popover and Command with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/combobox.json Fast, composable, command menu for React with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/command.json A window overlaid on the primary window with neubrutalism borders and shadows
npx shadcn@latest add https://boldkit.dev/r/dialog.json Displays a menu of actions/options with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/dropdown-menu.json Displays a menu triggered by right-click with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/context-menu.json A horizontal menu bar of desktop-style dropdown menus with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/menubar.json A collection of links and dropdown panels for site navigation with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/navigation-menu.json Resizable panel groups and handles with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/resizable.json Visually joins a row or column of buttons into one bordered unit
npx shadcn@latest add https://boldkit.dev/r/button-group.json An input joined with leading/trailing addons in a single bordered field
npx shadcn@latest add https://boldkit.dev/r/input-group.json Form field composition: label, control, description and error
npx shadcn@latest add https://boldkit.dev/r/field.json A styled wrapper around the native select element, a11y-first
npx shadcn@latest add https://boldkit.dev/r/native-select.json A single-date picker: a button trigger that opens a calendar popover
npx shadcn@latest add https://boldkit.dev/r/date-picker.json Displays a form input field with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/input.json Renders an accessible label for form controls
npx shadcn@latest add https://boldkit.dev/r/label.json Displays rich content in a portal with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/popover.json Displays an indicator showing the completion progress of a task
npx shadcn@latest add https://boldkit.dev/r/progress.json A set of checkable buttons where only one can be checked at a time
npx shadcn@latest add https://boldkit.dev/r/radio-group.json Augments native scroll functionality for custom styling
npx shadcn@latest add https://boldkit.dev/r/scroll-area.json Displays a list of options with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/select.json Visually separates content with a thick border
npx shadcn@latest add https://boldkit.dev/r/separator.json Extends Dialog to display content that complements the main page
npx shadcn@latest add https://boldkit.dev/r/sheet.json Used to show a placeholder while content is loading
npx shadcn@latest add https://boldkit.dev/r/skeleton.json A jelly slider with spring physics and bouncy animations
npx shadcn@latest add https://boldkit.dev/r/slider.json An opinionated toast component with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/sonner.json A control that allows the user to toggle between on and off
npx shadcn@latest add https://boldkit.dev/r/switch.json A responsive table component with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/table.json A tabbed interface component with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/tabs.json Displays a form textarea with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/textarea.json A two-state button that can be either on or off
npx shadcn@latest add https://boldkit.dev/r/toggle.json A group of toggle buttons where only one can be pressed at a time
npx shadcn@latest add https://boldkit.dev/r/toggle-group.json A popup that displays information related to an element
npx shadcn@latest add https://boldkit.dev/r/tooltip.json A modal dialog for important confirmations with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/alert-dialog.json A date picker calendar with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/calendar.json A drawer component that slides in from the edge of the screen
npx shadcn@latest add https://boldkit.dev/r/drawer.json A card that appears on hover with additional information
npx shadcn@latest add https://boldkit.dev/r/hover-card.json One-time password input with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/input-otp.json Pagination controls for navigating through pages
npx shadcn@latest add https://boldkit.dev/r/pagination.json Beautiful charts with neubrutalism styling built on Recharts
npx shadcn@latest add https://boldkit.dev/r/chart.json Auto-scrolling text ticker with neubrutalism styling - a common brutalist design element
npx shadcn@latest add https://boldkit.dev/r/marquee.json Rotated labels and stamps with tape effect and double borders - neubrutalist decorative elements
npx shadcn@latest add https://boldkit.dev/r/sticker.json Card component with stacked layers effect showing offset depth - neubrutalist depth illusion
npx shadcn@latest add https://boldkit.dev/r/layered-card.json 55 neubrutalist SVG shapes organized by category for badges, decorations, and visual accents
npx shadcn@latest add https://boldkit.dev/r/shapes.json BoldKit neubrutalism CSS variables and utilities
npx shadcn@latest add https://boldkit.dev/r/styles.json Loading spinner with multiple animation variants - dots, bars, blocks, and brutal shadow spin
npx shadcn@latest add https://boldkit.dev/r/spinner.json Keyboard key indicator for displaying shortcuts and hotkeys with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/kbd.json Statistics card with trend indicators, icons, and optional progress bars
npx shadcn@latest add https://boldkit.dev/r/stat-card.json Multi-step form wizard with progress indicators, compound components pattern
npx shadcn@latest add https://boldkit.dev/r/stepper.json Dependency-free multi-step form state layer with per-step validation, designed to compose with Stepper
npx shadcn@latest add https://boldkit.dev/r/multi-step-form.json Drag-and-drop file upload with validation, progress tracking, and file list
npx shadcn@latest add https://boldkit.dev/r/dropzone.json Tiny inline trend charts for tables and stat cards - line, area, and bar variants
npx shadcn@latest add https://boldkit.dev/r/sparkline.json Pie chart with center hole for KPI display, supports center content slot
npx shadcn@latest add https://boldkit.dev/r/donut-chart.json Circular progress bars with nested rings for multiple metrics
npx shadcn@latest add https://boldkit.dev/r/radial-bar-chart.json Multi-variable comparison chart for skills, metrics, and feature comparisons
npx shadcn@latest add https://boldkit.dev/r/radar-chart.json Speedometer-style gauge with color zones and animated needle - custom SVG implementation
npx shadcn@latest add https://boldkit.dev/r/gauge-chart.json Funnel chart for conversion flows and pipeline stages with neubrutalism styling
npx shadcn@latest add https://boldkit.dev/r/funnel-chart.json Treemap for hierarchical data visualization with proportional rectangles
npx shadcn@latest add https://boldkit.dev/r/treemap-chart.json Heatmap grid for correlation and intensity data - custom CSS Grid implementation
npx shadcn@latest add https://boldkit.dev/r/heatmap-chart.json Sankey flow diagram for showing proportional flows between nodes - custom SVG implementation
npx shadcn@latest add https://boldkit.dev/r/sankey-chart.json Star rating component with half-values, multiple icons, and keyboard navigation
npx shadcn@latest add https://boldkit.dev/r/rating.json Multi-tag input with suggestions, validation, and keyboard support
npx shadcn@latest add https://boldkit.dev/r/tag-input.json Popover-based time picker with 12h/24h format and scrollable columns
npx shadcn@latest add https://boldkit.dev/r/time-picker.json Date range picker with presets, dual calendars, and customizable options
npx shadcn@latest add https://boldkit.dev/r/date-range-picker.json Powerful data table with sorting, filtering, pagination, and row selection
npx shadcn@latest add https://boldkit.dev/r/data-table.json Carousel component with navigation, dots, and touch support built on Embla
npx shadcn@latest add https://boldkit.dev/r/carousel.json Composable timeline for activity feeds, order tracking, and version history
npx shadcn@latest add https://boldkit.dev/r/timeline.json Hierarchical tree view with expand/collapse, selection, and checkboxes
npx shadcn@latest add https://boldkit.dev/r/tree-view.json Collapsible sidebar with mobile drawer, tooltips, and keyboard shortcut
npx shadcn@latest add https://boldkit.dev/r/sidebar.json Step-by-step product tour with spotlight highlighting and progress indicators
npx shadcn@latest add https://boldkit.dev/r/tour.json Empty state component with icon, title, description, and optional actions
npx shadcn@latest add https://boldkit.dev/r/empty-state.json Framework-agnostic math engine for parametric curve animations (rose, lissajous, butterfly, hypotrochoid, cardioid, lemniscate, fourier, spiral, heart)
npx shadcn@latest add https://boldkit.dev/r/math-curves.json Animated mathematical curve loader with neubrutalism aesthetics — 8 curve variants including rose, lissajous, butterfly, and more
npx shadcn@latest add https://boldkit.dev/r/math-curve-loader.json Progress indicator that traces a mathematical curve — value-driven head moves along the curve path from 0 to 100%
npx shadcn@latest add https://boldkit.dev/r/math-curve-progress.json Ambient animated mathematical curve background layer with neubrutalism aesthetics — wraps content with a slow-moving curve animation
npx shadcn@latest add https://boldkit.dev/r/math-curve-background.json 7 animated ASCII art components (Spiral, Rose, Wave, Vortex, Pulse, Matrix, Grid) with 5 character sets, 4 sizes, and SSR-safe static mode
npx shadcn@latest add https://boldkit.dev/r/ascii-shapes.json BoldKit Motion System — framework-agnostic CSS tokens, keyframes, and six signature recipes (press, stamp-in, shake, reveal, slide-hard, pulse-shadow). Mobile-…
npx shadcn@latest add https://boldkit.dev/r/motion.json BoldKit Motion core — framework-agnostic, SSR-safe primitives (observeReveal, staggerChildren, triggerAnimation, startViewTransition, prefersReducedMotion) sha…
npx shadcn@latest add https://boldkit.dev/r/motion-core.json BoldKit Motion React adapter — <Motion>/<Reveal>/<Stagger> components plus useShake and useViewTransition hooks over a framework-agnostic core.
npx shadcn@latest add https://boldkit.dev/r/motion-react.json BoldKit chart export helpers — framework-agnostic, SSR-safe CSV / PNG / SVG download and fullscreen toggle. Works with any chart engine that renders an <svg> (…
npx shadcn@latest add https://boldkit.dev/r/chart-export.json Brutalist chart toolbar overlay — export the wrapped chart as PNG or SVG, download its data as CSV, and toggle fullscreen.
npx shadcn@latest add https://boldkit.dev/r/chart-toolbar.json