1 slot open this monthBy the makers of shadcnregistryWe built shadcnregistry. Now we build your product.Book a callCheck availability
1 slot open this monthAI features?We build AI features into your product.Book a callCheck availability
1 slot open this month🚨 Slop police🚨 Slop police: we clean up vibe-coded apps.Report itReport your app
shadcnregistry
shadcnregistry
RegistryHealthInspect
Terms of ServicePrivacy Policy
  1. Registries
  3. ecomcn
  5. Editorial Theme

Editorial Theme

theme

The ecomcn house style — warm paper, near-black ink, a single vermilion signal colour, and a 2px radius so nothing reads as a rounded card. Ships the complete shadcn token set plus --brand, --sale and --success.

pnpm dlx shadcn@latest add "https://ecomcn.vercel.app/r/theme-editorial.json"
Premium blocks for shadcn/uiShadcnblocks.com · AffiliateExplore

Light Mode

--background:

hsl(40 30% 97%)

--foreground:

hsl(30 9% 9%)

--card:

hsl(40 30% 99%)

--card-foreground:

hsl(30 9% 9%)

--popover:

hsl(40 30% 99%)

--popover-foreground:

hsl(30 9% 9%)

--primary:

hsl(30 9% 9%)

--primary-foreground:

hsl(40 30% 97%)

--secondary:

hsl(38 20% 92%)

--secondary-foreground:

hsl(30 9% 9%)

--muted:

hsl(38 18% 93%)

--muted-foreground:

hsl(32 6% 42%)

--accent:

hsl(38 20% 92%)

--accent-foreground:

hsl(30 9% 9%)

--destructive:

hsl(0 72% 42%)

--destructive-foreground:

hsl(40 30% 98%)

--border:

hsl(34 14% 85%)

--input:

hsl(34 14% 82%)

--ring:

hsl(12 76% 50%)

--brand:

hsl(12 76% 50%)

--brand-foreground:

hsl(40 30% 98%)

--sale:

hsl(0 72% 42%)

--success:

hsl(138 30% 34%)

--chart-1:

hsl(12 76% 50%)

--chart-2:

hsl(138 30% 34%)

--chart-3:

hsl(32 45% 52%)

--chart-4:

hsl(200 22% 45%)

--chart-5:

hsl(30 9% 25%)

--sidebar:

hsl(40 30% 99%)

--sidebar-foreground:

hsl(30 9% 9%)

--sidebar-primary:

hsl(30 9% 9%)

--sidebar-primary-foreground:

hsl(40 30% 97%)

--sidebar-accent:

hsl(38 20% 92%)

--sidebar-accent-foreground:

hsl(30 9% 9%)

--sidebar-border:

hsl(34 14% 85%)

--sidebar-ring:

hsl(12 76% 50%)

--radius:

0.125rem

Dark Mode

--background:

hsl(30 8% 7%)

--foreground:

hsl(40 22% 94%)

--card:

hsl(30 8% 10%)

--card-foreground:

hsl(40 22% 94%)

--popover:

hsl(30 8% 10%)

--popover-foreground:

hsl(40 22% 94%)

--primary:

hsl(40 22% 94%)

--primary-foreground:

hsl(30 8% 7%)

--secondary:

hsl(30 6% 16%)

--secondary-foreground:

hsl(40 22% 94%)

--muted:

hsl(30 6% 15%)

--muted-foreground:

hsl(36 8% 62%)

--accent:

hsl(30 6% 16%)

--accent-foreground:

hsl(40 22% 94%)

--destructive:

hsl(4 74% 58%)

--destructive-foreground:

hsl(30 8% 7%)

--border:

hsl(30 6% 20%)

--input:

hsl(30 6% 24%)

--ring:

hsl(14 82% 58%)

--brand:

hsl(14 82% 57%)

--brand-foreground:

hsl(30 8% 7%)

--sale:

hsl(4 74% 58%)

--success:

hsl(138 26% 52%)

--chart-1:

hsl(14 82% 57%)

--chart-2:

hsl(138 26% 52%)

--chart-3:

hsl(32 40% 62%)

--chart-4:

hsl(200 20% 60%)

--chart-5:

hsl(40 12% 74%)

--sidebar:

hsl(30 8% 10%)

--sidebar-foreground:

hsl(40 22% 94%)

--sidebar-primary:

hsl(40 22% 94%)

--sidebar-primary-foreground:

hsl(30 8% 7%)

--sidebar-accent:

hsl(30 6% 16%)

--sidebar-accent-foreground:

hsl(40 22% 94%)

--sidebar-border:

hsl(30 6% 20%)

--sidebar-ring:

hsl(14 82% 58%)