distinctive-frontend

Catalogue stub — full package: Koomook/claude-frontend-skills

Decision tree

1. Is the package already installed?

Check: your agent's skills directory contains distinctive-frontend with content beyond this stub. - Yes → invoke distinctive-frontend and proceed - No → go to step 2

1. Which agent are you on?

- Claude Code → npm install -g @bong/claude-frontend-skills - Cursor → npm install -g @bong/claude-frontend-skills - Other → npm install -g @bong/claude-frontend-skills or see GitHub README

Install command

npm install -g @bong/claude-frontend-skills

Invoke after install

• Skill name: distinctive-frontend
• Trigger phrases: "distinctive frontend", "cyberpunk UI", "brutalist frontend", "vaporwave design", "nordic minimalism"

What it does

Packages four fully-specified design systems in a single skill: Cyberpunk (neon-on-dark, tech typography, glitch effects), Brutalist (high-contrast, raw grid, bold sans), Vaporwave (pastel gradients, retro type, synthwave motion), and Nordic Minimalism (clean whitespace, muted palette, functional sans). Each theme ships with curated typography pairings, a complete color system, and pre-built staggered animation sequences. Choose a theme by name and the skill generates production-ready component code aligned to that aesthetic.

When NOT to use

• When you need production-safe, conservative design (these themes are opinionated and experimental — not suitable for enterprise SaaS or regulated industries without significant adaptation)
• When you need to mix themes or create a hybrid aesthetic (each theme is self-contained and opinionated)