bergside

bergside/awesome-design-skills

72 resources in this repository

GitHub
🎯72

🎯Skills72

🎯dashboard🎯Skill

A design system skill for building dark-themed cloud-platform dashboards with modular grids, glass-like panels, and strong data hierarchy, inspired by Heroku/Vercel/GitHub aesthetics with IBM Plex Sans typography and an 8pt baseline grid.

dashboard
🎯luxury🎯Skill

A design system skill that provides implementation-ready guidance for a luxury brand aesthetic, featuring a modern bold style with dark monochromatic palette, Oswald typography, 8pt spacing grid, and accessibility-first interaction patterns.

luxury
🎯glassmorphism🎯Skill

A design system skill that provides implementation-ready Glassmorphism guidelines, including frosted glass effects with translucent layers, subtle blur, luminous borders, and WCAG 2.2 AA-compliant accessibility standards for modern UI development.

glassmorphism
🎯premium🎯Skill

A premium design system skill from the Awesome Design Skills registry, providing design tokens, component guidelines, accessibility rules, and implementation-ready specifications for AI agents building interfaces.

premium
🎯editorial🎯Skill

A design system skill providing magazine-inspired editorial layout with refined serif typography, structured grids, and elegant reading experiences, from the Awesome Design Skills registry.

editorial
🎯minimal🎯Skill

A design system skill from Awesome Design Skills that provides minimal design tokens, component guidelines, accessibility rules, and implementation specs for AI agents. Part of a curated registry of design system skills installable via typeui.sh for consistent, accessible UI generation.

minimal
🎯neobrutalism🎯Skill

A design system skill file from the Awesome Design Skills registry that provides design tokens, component guidelines, accessibility rules, and implementation-ready specifications for AI agents to follow the Neobrutalism design system when building interfaces.

neobrutalism
🎯neumorphism🎯Skill

A design system skill for neumorphism-style UIs featuring soft extruded elements with inner and outer shadows on monochromatic surfaces, including detailed component rules, WCAG 2.2 AA accessibility guidelines, and implementation-ready design tokens using Space Mono typography.

neumorphism
🎯futuristic🎯Skill

A design system skill providing implementation-ready guidelines for a futuristic aesthetic with tech-inspired typography (Roboto, Audiowide), modern color tokens, WCAG 2.2 AA accessibility, and structured component rules for engineers and designers.

futuristic
🎯bento🎯Skill

A Layout & Structure design system skill from the Awesome Design Skills registry, providing bento-grid design tokens and component guidelines for organized, modular card-based interfaces.

bento
🎯enterprise🎯Skill

A design system skill for enterprise applications that provides clean, high-contrast guidelines with structured layouts, drag-and-drop patterns, Ubuntu font family, and WCAG 2.2 AA accessibility compliance.

enterprise
🎯shadcn🎯Skill

A shadcn/ui design system skill from the Awesome Design Skills registry, providing SKILL.md files with design tokens, component guidelines, and accessibility rules for AI agents to generate interfaces following the shadcn/ui design system.

shadcn
🎯claymorphism🎯Skill

A claymorphism design system skill from the Awesome Design Skills registry, providing SKILL.md files with design tokens, component guidelines, and accessibility rules for AI agents to generate consistent claymorphism-style UI.

claymorphism
🎯corporate🎯Skill

A corporate design system skill from the Awesome Design Skills registry, providing SKILL.md files with design tokens, component guidelines, and accessibility rules for AI agents to generate professional corporate-style interfaces.

corporate
🎯gradient🎯Skill

A design system skill providing smooth color transitions and gradient-rich surfaces for modern, playful interfaces with visual depth, from the Awesome Design Skills registry by typeui.sh.

gradient
🎯cosmic🎯Skill

A design system skill providing a futuristic sci-fi aesthetic with dark themes, vibrant neon accents, and immersive spatial elements for creative interfaces, from the Awesome Design Skills registry.

cosmic
🎯professional🎯Skill

A Professional & Corporate design system skill from the Awesome Design Skills registry, providing clean, business-oriented design tokens and component guidelines for polished enterprise interfaces.

professional
🎯clean🎯Skill

A Modern & Minimal design system skill from the Awesome Design Skills registry, providing design tokens, component guidelines, and accessibility rules for AI agents to build clean, minimal interfaces.

clean
🎯colorful🎯Skill

A design system skill providing vibrant, high-contrast palettes and gradients for engaging, memorable, and modern user experiences, from the Awesome Design Skills registry.

colorful
🎯modern🎯Skill

A design system skill providing contemporary editorial style with serif typography, minimal palettes, and clean layouts for polished digital products, from the Awesome Design Skills registry.

modern
🎯refined🎯Skill

A design system skill that provides implementation-ready guidelines for a modern minimal style with elegant serif typography (Playfair Display), sophisticated color palettes, and WCAG 2.2 AA accessibility standards.

refined
🎯brutalism🎯Skill

A design system skill providing a raw, anti-design aesthetic inspired by concrete architecture with unadorned elements, jarring layouts, and functional minimalism, from the Awesome Design Skills registry.

brutalism
🎯artistic🎯Skill

A design system skill file from the Awesome Design Skills registry that provides design tokens, component guidelines, accessibility rules, and implementation-ready specifications to instruct AI agents in building consistent, accessible interfaces.

artistic
🎯material🎯Skill

A Professional & Corporate design system skill from the Awesome Design Skills registry, providing Material Design-inspired tokens and component guidelines for AI agents building enterprise interfaces.

material
🎯flat🎯Skill

A design system skill for flat/minimalist UI style featuring two-dimensional elements, vibrant colors (Inter font family), and clean typography without 3D effects like shadows or gradients. Focuses on functionality, fast loading, and WCAG 2.2 AA accessibility compliance.

flat
🎯creative🎯Skill

A playful design system skill for creative landing pages featuring the Bangers display font, bold graphics, expressive character-driven design, and WCAG 2.2 AA accessibility standards.

creative
🎯dramatic🎯Skill

A Bold & Expressive design system skill from the Awesome Design Skills registry, providing design tokens and component guidelines for AI agents to build dramatic, high-impact interfaces.

dramatic
🎯vintage🎯Skill

A design system skill that provides implementation-ready guidelines for vintage-themed interfaces inspired by 1950s-1990s aesthetics, featuring skeuomorphic touches, grainy textures, retro color palettes, and pixel-style Silkscreen typography. Includes WCAG 2.2 AA accessibility standards and detailed component authoring workflows.

vintage
🎯paper🎯Skill

A design system skill providing paper-textured, print-inspired design with minimal colors, clean serif/sans typography, and tactile surface qualities, from the Awesome Design Skills registry.

paper
🎯storytelling🎯Skill

A design system skill providing narrative-driven design using visuals, copy, and interaction to guide users through engaging, emotionally resonant journeys, from the Awesome Design Skills registry.

storytelling
🎯contemporary🎯Skill

A Modern & Minimal design system skill from the Awesome Design Skills registry, providing contemporary design tokens and component guidelines for sleek, modern interfaces.

contemporary
🎯friendly🎯Skill

A Creative & Artistic design system skill from the Awesome Design Skills registry, providing friendly, approachable design tokens and component guidelines for warm, inviting interfaces.

friendly
🎯doodle🎯Skill

A design system skill with a hand-drawn, sketch-like aesthetic using the Delius Swash Caps font, doodle illustrations, and imperfect lines to create a playful, informal feel while maintaining WCAG 2.2 AA accessibility compliance.

doodle
🎯neon🎯Skill

A Morphism & Effects design system skill from the Awesome Design Skills registry, providing neon-themed design tokens and glowing effects for AI agents to build luminous interfaces.

neon
🎯elegant🎯Skill

A design system skill that provides implementation-ready guidelines for an elegant, refined aesthetic, including typography scales, color token definitions, spacing systems, WCAG 2.2 AA accessibility requirements, and component-level rules with interaction states and responsive behavior.

elegant
🎯fantasy🎯Skill

A Creative & Artistic design system skill from the Awesome Design Skills registry, providing fantasy-themed design tokens and component guidelines for imaginative, story-rich interfaces.

fantasy
🎯agentic🎯Skill

A Themed & Unique design system skill from the Awesome Design Skills registry, providing agentic AI-themed design tokens and component guidelines for futuristic agent interfaces.

agentic
🎯retro🎯Skill

A design system skill that provides implementation-ready guidelines for retro-themed interfaces, featuring high-contrast palettes, vintage-inspired typography with Macondo fonts, and nostalgic visual elements. Includes WCAG 2.2 AA accessibility standards, semantic token definitions, and component-level authoring workflows.

retro
🎯dithered🎯Skill

A Retro & Nostalgic design system skill from the Awesome Design Skills registry, providing dithered, pixel-art-inspired design tokens and component guidelines for retro-styled interfaces.

dithered
🎯sleek🎯Skill

Design system skill providing modern minimalist aesthetic guidelines with clean lines, intentional color palette using the 60-30-10 rule, Inter font family, and consistent 8pt spacing grid.

sleek
🎯levels🎯Skill

A design system skill that provides implementation-ready guidelines for conversion-focused interfaces, emphasizing friction removal, trust building, and clarity with defined typography, color tokens, and WCAG 2.2 AA accessibility standards.

levels
🎯ant🎯Skill

A Professional & Corporate design system skill from the Awesome Design Skills registry, providing Ant Design-inspired tokens and component guidelines for enterprise-grade interfaces.

ant
🎯bold🎯Skill

A Bold & Expressive design system skill from the Awesome Design Skills registry, providing bold, high-impact design tokens and component guidelines for commanding, attention-grabbing interfaces.

bold
🎯skeumorphism🎯Skill

A design system skill providing real-world mimicry with textured surfaces, 3D effects, and familiar physical metaphors for intuitive digital interfaces, from the Awesome Design Skills registry.

skeumorphism
🎯perspective🎯Skill

A design system skill that provides implementation-ready guidance for creating spatial depth with isometric views, vanishing points, and layered elements, including typography scales, color tokens, and WCAG 2.2 AA accessibility standards.

perspective
🎯cafe🎯Skill

A Creative & Artistic design system skill from the Awesome Design Skills registry, providing cafe-themed warm design tokens and component guidelines for cozy, inviting interfaces.

cafe
🎯expressive🎯Skill

A design system skill that provides implementation-ready guidance for the Expressive style β€” featuring bold colors, playful graphics, and dynamic layouts with IBM Plex Mono typography, WCAG 2.2 AA accessibility, and comprehensive component rules.

expressive
🎯mono🎯Skill

A monospace-driven, matrix-inspired design system skill providing implementation-ready guidance with high-contrast elements, compact density, and a hacker-chic aesthetic. Defines style foundations including Space Mono typography, a neon-green primary color palette, WCAG 2.2 AA accessibility standards, and component authoring rules.

mono
🎯pacman🎯Skill

Design system skill providing retro arcade-inspired guidelines with pixel fonts (Press Start 2P), high-contrast playful colors, dotted borders, and 8-bit game aesthetics for WCAG 2.2 AA accessible interfaces.

pacman
🎯vibrant🎯Skill

Design system skill with lively, colorful aesthetics featuring Noto Sans and Fascinate fonts, bold playful typography, warm accent colors, and dynamic visual energy with WCAG 2.2 AA accessibility.

vibrant
🎯lingo🎯Skill

A Duolingo-inspired design system skill that provides implementation-ready guidance for playful, minimal interfaces with bright colors, rounded shapes, tactile 3D borders, and WCAG 2.2 AA accessible components using Nunito typography and a vibrant color palette.

lingo
🎯tetris🎯Skill

Design system skill with classic block-game-inspired aesthetics featuring bold Bangers display font, high-contrast playful colors, compact density spacing, and premium visual style.

tetris
🎯spacious🎯Skill

Design system skill emphasizing generous whitespace, consistent padding, and 8-point grid-based layouts with Open Sans and Montserrat fonts for clean, readable, breathing interfaces.

spacious
🎯application🎯Skill

A design system skill file from the Awesome Design Skills registry that provides design tokens, component guidelines, accessibility rules, and implementation-ready specifications for AI agents to follow the Application design system when building interfaces.

application
🎯publication🎯Skill

A Creative & Artistic design system skill from the Awesome Design Skills registry, providing publication-style design tokens and component guidelines for rich editorial and content-driven interfaces.

publication
🎯energetic🎯Skill

A Bold & Expressive design system skill from the Awesome Design Skills registry, providing energetic, vibrant design tokens and component guidelines for dynamic, high-energy interfaces.

energetic
🎯simple🎯Skill

Design system skill providing straightforward, no-frills guidelines with Inter font, minimal clean visual style, neutral colors, and consistent 4/8/12/16/24/32 spacing scale for intuitive layouts.

simple
🎯immersive🎯Skill

A design skill that generates immersive, exhibit-style UI with storytelling, animation, and gamified elements on a continuous deep-green canvas, using bold typography, hard-shadow cards, and geometric accent blocks.

immersive
🎯impeccable🎯Skill

Part of Awesome Design Skills β€” a curated registry of 67 design system skill files for AI-powered tools like Claude Code, Cursor, and Codex, with each skill shipping as SKILL.md (AI instructions) and DESIGN.md (human-readable rationale).

impeccable
🎯claude🎯Skill

A Claude design system skill that encodes the Anthropic brand guidelines β€” warm ivory parchment backgrounds, near-black slate ink, Anthropic Sans and Serif typography, flat buttons, and earthy clay accents β€” as practical, implementation-ready guidance for engineers and designers. Enforces WCAG 2.2 AA accessibility and emphasizes semantic design tokens over raw values.

claude
🎯fiction🎯Skill

A UI design skill that defines a playful, cartoonesque visual style inspired by friendly children's book illustrations β€” featuring warm cream backgrounds, bold display typography, saturated color blocks, thick black outlines, and generously rounded shapes.

fiction
🎯codex🎯Skill

A design system skill that provides implementation-ready guidance for a radically minimal, blank-canvas UI style using edge-to-edge surfaces, black-only color fills, pill-shaped interactive elements, and typography-driven visual hierarchy with WCAG 2.2 AA accessibility compliance.

codex
🎯matrix🎯Skill

A design system skill defining a Matrix-inspired, dark-only UI aesthetic with monospaced typography (Space Mono), deep monochromatic surfaces, single brand-green accent, and terminal-style dense layouts following WCAG 2.2 AA accessibility standards.

matrix
🎯sega🎯Skill

A design system guidance skill that codifies Sega's arcade-inspired visual style β€” featuring the VT323 pixel typeface, hard-edged 0px corners, chunky pill buttons with solid offset blocks, and rainbow-ringed brand shadows β€” providing implementation-ready design tokens, component rules, and accessibility criteria for engineers and designers.

sega
🎯riso🎯Skill

A design system skill implementing a playful two-color risograph print aesthetic with fluorescent pink and federal blue on warm off-white, including typography scales, color tokens, spacing foundations, and WCAG 2.2 AA accessibility guidelines.

riso
🎯sketch🎯Skill

A hand-drawn sketch design system inspired by pencil illustrations on warm cream paper, featuring soft teal accents, hand-written headings, rounded pill controls, and dashed card outlines.

sketch
🎯terracotta🎯Skill

A sun-baked, clay-toned editorial design system built on warm cream surfaces, ink-brown display serif headlines, and terracotta accents, optimized for long-form reading and storytelling layouts.

terracotta
🎯pulse🎯Skill

Skill

pulse
🎯roku🎯Skill

Skill

roku
🎯basic🎯Skill

Skill

basic
🎯stitch🎯Skill

Skill

stitch
🎯geometric🎯Skill

Skill

geometric