Star 1
Installation
No MCP yet? Connect your agent.
No MCP yet? Connect your agent.
Decorative neobrutalist star shape 1, delivered as a customizable React SVG with color, size, stroke, and path class props.
Use this as decoration or an icon-like accent. Set an accessible label only when the shape carries meaning; otherwise hide it from assistive technology.
Keep the host project's aliases and component placement conventions. Preserve the upstream interaction behavior and accessibility attributes when adapting the styling.
This collection delivers source through the publisher's public shadcn registry. The components target React, Tailwind CSS v4, and Base UI. Apply one complete theme before adding components. Do not merge several palette items into the same CSS variable scope.
For a new shadcn project, initialize with the chosen theme item. For an existing project, add it. A theme item supplies the palette, design tokens, global rules, tw-animate-css, class-variance-authority, lucide-react, and the Button dependency.
The collection includes every public palette install unit:
The default upstream palette is blue. A palette is a complete choice, not an accent to layer over another palette.
Keep @import "tailwindcss" and @import "tw-animate-css". The theme maps these variables through @theme inline:
--main, --background, --secondary-background, --foreground, --main-foreground, --border, --ring, --overlay, and --chart-1 through --chart-5.--border-radius, exposed as --radius-base.--box-shadow-x, --box-shadow-y, --reverse-box-shadow-x, --reverse-box-shadow-y, and --shadow.--font-weight-base and --font-weight-heading.--animate-marquee, --animate-marquee2, and their matching keyframes.Keep the base body and heading font-weight rules, plus the .scrollbar track and thumb rules installed by the style. Components refer to utilities such as bg-main, bg-secondary-background, rounded-base, shadow-shadow, font-base, and font-heading; replacing the variables without preserving those mappings breaks the look.
The public style payloads define one light variable set. They do not include a dark-mode variable set. Add a dark theme only as an intentional project adaptation, with contrast checked across borders, text, controls, and charts.
The default is DM Sans. The publisher's styling surface supports these Google Fonts and weights:
Load one with the host framework and apply its font family to the body or app shell, for example the className returned by next/font/google. The public registry styles do not download a font or define a font-family token. font-base and font-heading are font-weight utilities, not font-family utilities. The styling website uses additional font-selection variables that are not included in the public palette payload. Keep headings at --font-weight-heading: 700 and body text at --font-weight-base: 500 unless the project deliberately changes the type system.
Popup components use @base-ui/react. Give the element wrapping the application a positioned isolation context, for example className="relative isolate" on body or the app shell. This keeps dialogs, menus, popovers, selects, and tooltips above surrounding content.
Base UI uses render instead of Radix's asChild, exposes state with attributes such as data-open, data-closed, data-checked, and data-active, and sends an event details object as the second argument to change handlers. Preserve those semantics when adapting an older integration.
Let the shadcn installer resolve aliases, package dependencies, CSS variables, and upstream registry dependencies. Several public components depend on publisher-only n* aliases. Those aliases intentionally remain external dependencies and are not duplicate Catalogs listings.
The 40 star items are independent SVG components. They accept color, size, stroke, stroke width, path class, and ordinary SVG props. Treat a decorative star as hidden from assistive technology. Give it an accessible name only when the shape communicates meaning.
After integration, verify keyboard interaction, focus visibility, popup stacking, disabled states, the selected font, and chart contrast against the chosen palette.
Decorative neobrutalist star shape 1, delivered as a customizable React SVG with color, size, stroke, and path class props.
Use this as decoration or an icon-like accent. Set an accessible label only when the shape carries meaning; otherwise hide it from assistive technology.
Keep the host project's aliases and component placement conventions. Preserve the upstream interaction behavior and accessibility attributes when adapting the styling.
This collection delivers source through the publisher's public shadcn registry. The components target React, Tailwind CSS v4, and Base UI. Apply one complete theme before adding components. Do not merge several palette items into the same CSS variable scope.
For a new shadcn project, initialize with the chosen theme item. For an existing project, add it. A theme item supplies the palette, design tokens, global rules, tw-animate-css, class-variance-authority, lucide-react, and the Button dependency.
The collection includes every public palette install unit:
The default upstream palette is blue. A palette is a complete choice, not an accent to layer over another palette.
Keep @import "tailwindcss" and @import "tw-animate-css". The theme maps these variables through @theme inline:
--main, --background, --secondary-background, --foreground, --main-foreground, --border, --ring, --overlay, and --chart-1 through --chart-5.--border-radius, exposed as --radius-base.--box-shadow-x, --box-shadow-y, --reverse-box-shadow-x, --reverse-box-shadow-y, and --shadow.--font-weight-base and --font-weight-heading.--animate-marquee, --animate-marquee2, and their matching keyframes.Keep the base body and heading font-weight rules, plus the .scrollbar track and thumb rules installed by the style. Components refer to utilities such as bg-main, bg-secondary-background, rounded-base, shadow-shadow, font-base, and font-heading; replacing the variables without preserving those mappings breaks the look.
The public style payloads define one light variable set. They do not include a dark-mode variable set. Add a dark theme only as an intentional project adaptation, with contrast checked across borders, text, controls, and charts.
The default is DM Sans. The publisher's styling surface supports these Google Fonts and weights:
Load one with the host framework and apply its font family to the body or app shell, for example the className returned by next/font/google. The public registry styles do not download a font or define a font-family token. font-base and font-heading are font-weight utilities, not font-family utilities. The styling website uses additional font-selection variables that are not included in the public palette payload. Keep headings at --font-weight-heading: 700 and body text at --font-weight-base: 500 unless the project deliberately changes the type system.
Popup components use @base-ui/react. Give the element wrapping the application a positioned isolation context, for example className="relative isolate" on body or the app shell. This keeps dialogs, menus, popovers, selects, and tooltips above surrounding content.
Base UI uses render instead of Radix's asChild, exposes state with attributes such as data-open, data-closed, data-checked, and data-active, and sends an event details object as the second argument to change handlers. Preserve those semantics when adapting an older integration.
Let the shadcn installer resolve aliases, package dependencies, CSS variables, and upstream registry dependencies. Several public components depend on publisher-only n* aliases. Those aliases intentionally remain external dependencies and are not duplicate Catalogs listings.
The 40 star items are independent SVG components. They accept color, size, stroke, stroke width, path class, and ordinary SVG props. Treat a decorative star as hidden from assistive technology. Give it an accessible name only when the shape communicates meaning.
After integration, verify keyboard interaction, focus visibility, popup stacking, disabled states, the selected font, and chart contrast against the chosen palette.