For the complete documentation index, see llms.txt. Markdown variants are available by appending .md to any URL or sending an Accept: text/markdown header. An agent skill is available at /.well-known/agent-skills/site-skill.md.
Home

New Icon

Replace this description with a one-line summary of what the icon set covers.

import { NewIcon } from "@/components/ui/new-icon";

export const NewIconDemo = () => <NewIcon size={32} />;

Props

PropTypeDefaultDescription
classNamestring—Additional CSS classes
sizenumber24Icon size in pixels

Usage

import { NewIcon } from "@/components/ui/new-icon";
 
<NewIcon />

Specs

# i-new-icon — Icon Specs
 
## Component
- name: new-icon
- file: registry/mint/new-icon.tsx
- installs to: components/ui/new-icon.tsx
- dependencies: (none — add if needed)
- registryDependencies: (none — add if needed)
 
## What is it
Replace this with a description of what the icon set covers, when to use it
instead of the default `lucide-react` set, and any brand-specific meaning
individual glyphs carry.
 
## Visual identity
Describe the visual character of this icon set in this theme.
- Stroke/fill: (e.g. stroke-based, 1.5px, currentColor)
- Grid: (e.g. 24x24 viewBox)
- Weight: (e.g. light, regular, bold)
- Key trait: (the one thing that makes it recognisable)
 
## Design tokens
--foreground: oklch(0.145 0 0)
--muted-foreground: oklch(0.52 0.06 155)
--primary: oklch(0.5 0.14 155)
 
## shadcn config (components.json)
- style: new-york
- rsc: true
- tsx: true
- baseColor: neutral
- cssVariables: true
- iconLibrary: lucide
- aliases:
  - components → @/components
  - ui → @/components/ui
  - utils → @/lib/utils
  - lib → @/lib
  - hooks → @/hooks
 
## Variants
- default → currentColor, inherits from parent text color
- (add more variants as needed, e.g. filled, duotone)
 
## States
- default:  (describe the resting appearance)
- disabled: opacity-50
 
## Conventions
- Use cn() from @/lib/utils for all conditional classNames
- Icons use the i- prefix to distinguish from elements (e-), blocks (b-), and charts (c-)
- Use currentColor for stroke/fill so icons inherit text color by default
- Accept a `size` prop (number, in pixels) — do not hardcode dimensions
- Tailwind CSS 4 utility classes only — no inline styles
- No external dependencies unless declared in registry.json
- Decorative icons need aria-hidden; meaningful icons need aria-label

Installation

GIN Design Plugin
$ npx shadcn add https://gin-design.vercel.app/new-icon