Design Trends

17 kompletta 2026 webbdesign-stilsystem med exakta CSS vars, Tailwind-konfiguration och do/don'ts.

av growthaudit · growthaudit/claude-design-skills

Testad · Fungerar ★ 9.6/10

Design Trends — 17 kompletta 2026 webbdesign-stilsystem med exakta CSS vars, Tailwind-konfiguration och do/don'ts.

Vad den gör

Tillämpar ett av 17 kompletta 2026 webbdesign-trendsystem (neo-brutalism, neumorphism, dark mode, retrofuturism, chatbot UI, etc.) på valfri UI-artefakt, var och en paketerad med CSS custom properties, Tailwind-konfiguration, typografipar, layoutprinciper, do/don't-regler och referenskomponentmönster. Utlöses när användaren nämner en trend, ber om något 'trendy'/'2026 style'/'Y2K', eller vill att en design ska kännas mindre generisk/AI-standard.

Testrapport

Bad den att neo-brutalize en hero-sektion: den levererade exakta, åsiktstrogna tokens (3px border, 5px/5px/0 hård skugga, Space Grotesk/DM Sans/Space Mono typsnittstrio, noll border-radius, hover/active shadow-lift-recept) plus explicita do/don't-regler — ett minnesbaserat försök utan filen producerade endast vaga 'tjock kant, djärva färger'-gissningar med inga konkreta värden.

Testad: 2026-07-16 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/growthaudit/claude-design-skills
cd claude-design-skills
mkdir -p ~/.claude/skills
cp -r . ~/.claude/skills/design-trends

Kommandon och exempelprompter

/design-trends17 kompletta 2026 webbdesign-stilsystem med exakta CSS vars, Tailwind-konfiguration och do/don'ts.

Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):

Give this hero section a neo-brutalist look with real CSS values
Make this dashboard feel less generic, more 2026 Y2K style
Restyle our chatbot UI using an actual neumorphism token system

Läs hela rapporten →