New drop · Mon 16 Nov · 54 new
186 components, from switches to dashboards, each in 20 design languages: Material, Apple, Glass, Neo-brutal, Terminal and more. Add what you need to a pack and your coding agent installs all of it from elementshelf-pack.md.
Works with CursorClaude CodeLovableReplitFigma Makev0
What is ElementShelf?
ElementShelf is a UI component library for coding agents. It has 186 components, each in 20 design languages, 3,720 designs in all. You download one file, elementshelf-pack.md, and the agent installs the components you picked.
Browse by design
All 20 designs →MaterialLight · 16px radiusAppleLight · 14px radiusMinimalLight · 12px radiusGlassDark · 22px radiusNeo-brutalLight · 8px radiusBento DarkDark · 18px radiusClayLight · 28px radiusRetro Y2KLight · 6px radiusSwissLight · 0px radiusAuroraDark · 20px radiusEditorialLight · 2px radiusTerminalDark · 6px radiusPastelLight · 24px radiusLuxeDark · 0px radiusPlayfulLight · 20px radiusEnterpriseLight · 4px radiusCyberDark · 4px radiusOrganicLight · 26px radiusMonoLight · 10px radiusHigh ContrastLight · 8px radius
Trending this week
by new stars, 7 daysNew this week
54 components · 20 designs eachBrowse by category
186 of 186 ready · more every weekHow the pack works
One file. Your agent does the rest.
CursorClaude CodeLovableReplitFigma Makev0
- Pick components and designsAdd any number of components to your pack, each in the design you like. Give each its own motion and accent, or apply one to all of them at once.
- Download
elementshelf-pack.mdAgent instructions, the design tokens and every component file, in one Markdown file. - Hand it to your agentSay "Install the components in elementshelf-pack.md into this app. Keep our pages and our words." The agent adds the components only, and uses the copy already in your project. Prefer the terminal? Each component also installs with
npx shadcn add.