SkillDesign
UI & Widgets (P1)
Principles for maintainable UI components.
✳Claude Code>_Codex↗Cursor+1
By ngxtmOriginal project
7 GitHub starsMIT · FreeView skill
FREE RESOURCE LIBRARYAI prompts and
AI prompts and
agent skills.
Browse reusable instructions for your AI tools. Copy and customize a prompt, or download a skill for a supported agent.
108 prompts34951 skills6 platforms
Browse resources 
BROWSE RESOURCES
Gemini resources2554 resources
SkillDesign
Ui Skills
Opinionated, evolving constraints to guide agents when building interfaces
✳Claude Code>_Codex↗Cursor+1
By ngxtmOriginal project
7 GitHub starsMIT · FreeView skill
SkillDesign
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beaut...
✳Claude Code>_Codex↗Cursor+1
By onmaxOriginal project
0 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Review Web Design
Evaluates web design for visual quality, consistency, and effectiveness across devices, ensuring optimal user experience.
✳Claude Code>_Codex↗Cursor+1
By pjt222Original project
20 GitHub starsMIT · FreeView skill
SkillDesign
Tailwind Design System
Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.
✳Claude Code>_Codex↗Cursor+1
By rmyndharisOriginal project
494 GitHub starsMIT · FreeView skill
SkillDesign
3D Web Experience
Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing ...
✳Claude Code>_Codex↗Cursor+1
By rootcastlecoOriginal project
5 GitHub starsMIT · FreeView skill
SkillDesign
Frontend Design (Distinctive, Production-Grade)
Create distinctive, production-grade frontend interfaces with intentional aesthetics, high craft, and non-generic visual identity. Use when building or styling web UIs, components, pages, dashboard...
✳Claude Code>_Codex↗Cursor+1
By rootcastlecoOriginal project
5 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Radix UI Design System
Build accessible design systems with Radix UI primitives. Headless component customization, theming strategies, and compound component patterns for production-grade UI libraries.
✳Claude Code↗Cursor◎ChatGPT+1
By rootcastlecoOriginal project
5 GitHub starsMIT · FreeView skill
SkillDesign
Tailwind Design System
Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI...
✳Claude Code>_Codex↗Cursor+1
By rootcastlecoOriginal project
5 GitHub starsMIT · FreeView skill
SkillDesign
Tailwind CSS Patterns (v4 - 2025)
Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.
✳Claude Code>_Codex↗Cursor+1
By rootcastlecoOriginal project
5 GitHub starsMIT · FreeView skill
SkillDesign
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
✳Claude Code>_Codex↗Cursor+1
By simplefarmer69Original project
2 GitHub starsMIT · FreeView skill
SkillDesign
3D Web Experience
Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing depth to web experiences. Use when: 3D website, three.js, WebGL, react three fiber, 3D experience.
✳Claude Code>_Codex↗Cursor+1
By techwavedevOriginal project
3 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Tailwind CSS Patterns (v4 - 2025)
Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.
✳Claude Code>_Codex↗Cursor+1
By techwavedevOriginal project
3 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Atomic Design: Atoms
Use when creating atomic-level UI components like buttons, inputs, labels, and icons. The smallest building blocks of a design system.
✳Claude Code>_Codex↗Cursor+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Atomic Design: Molecules
Use when composing atoms into molecule components like form fields, search bars, and card headers. Molecules are functional groups of atoms.
✳Claude Code↗Cursor◎ChatGPT+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Atomic Design: Organisms
Use when building complex organisms from molecules and atoms like headers, footers, product cards, and sidebars. Organisms are distinct UI sections.
✳Claude Code↗Cursor◎ChatGPT+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Atomic Design: Templates
Use when creating page layouts without real content. Templates define the skeletal structure of pages using organisms, molecules, and atoms.
✳Claude Code>_Codex↗Cursor+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Extract Design Tokens from Figma
Extract design tokens and variables from a Figma file to create or update a design system
✳Claude Code>_Codex↗Cursor+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Tailwind CSS - Responsive Design
Use when building responsive layouts and mobile-first designs with Tailwind CSS. Covers breakpoints, container queries, and responsive utilities.
✳Claude Code>_Codex↗Cursor+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Tailwind CSS - Utility Classes
Use when working with Tailwind CSS utility classes for layout, spacing, typography, colors, and visual effects. Covers utility-first CSS patterns and class composition.
✳Claude Code>_Codex↗Cursor+1
By TheBushidoCollectiveOriginal project
166 GitHub starsApache-2.0 · FreeView skill
SkillDesign
Role: Frontend Expert
Expert in Modern React, TailwindCSS, and Aesthetic UI Design. Use for React components, styling, state management, and frontend architecture.
✳Claude Code>_Codex↗Cursor+1
By traylinxOriginal project
2 GitHub starsApache-2.0 · FreeView skill
SkillFinance & Accounting
orders:query — validated against api_version 2025-01
Read-only: calculates true net profit per order and per product by factoring in COGS, shipping costs, transaction fees, discounts, refunds, and taxes.
✳Claude Code>_Codex↗Cursor+1
By 40RTY-aiOriginal project
157 GitHub starsMIT · FreeView skill
SkillFinance & Accounting
giftCards:query — validated against api_version 2025-01
Read-only: lists all active gift cards with remaining balance, expiry, and last-used date for liability tracking.
✳Claude Code>_Codex↗Cursor+1
By 40RTY-aiOriginal project
157 GitHub starsMIT · FreeView skill
SkillFinance & Accounting
orders:query — validated against api_version 2025-01
Read-only: breaks down revenue, units, and AOV by sales channel (Online Store, POS, Draft Orders, etc.).
✳Claude Code>_Codex↗Cursor+1
By 40RTY-aiOriginal project
157 GitHub starsMIT · FreeView skill
No matching resources.
Try another platform, a broader search, or fewer filters.
Explore all resourcesResource formats: Prompts are ready to copy into a conversation. Skills install into the compatible agent shown on their page.
How it worksCONTRIBUTE
Submit a resourceSubmit a prompt or skill
Include the instructions, intended platforms, author, and license. Submissions are reviewed before publication.