Skip to content

mager/frontend-design

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 

Repository files navigation

frontend-design

A frontend design skill for Claude Code that builds hot, sleek, sexy, usable, fun, and addictive interfaces.

Dark-first themes, terminal-inspired typography, neon accents, tactile micro-interactions, and visual discovery patterns — distilled from real projects into a reusable skill.

Install

npx skills add mager/frontend-design

What it does

  • Generate new UI — Describe what you want and get components/pages in this style
  • Restyle existing code — Point it at your frontend and it'll apply the aesthetic
  • Design guidance — Ask for feedback and get opinionated direction

The aesthetic

  • Dark mode by default (rich blacks, not gray)
  • JetBrains Mono + Space Grotesk typography
  • Neon accent colors — cyan, purple, lime, gold, coral
  • Tactile hover interactions (lifts, glows, border transitions)
  • Visual discovery layouts (masonry walls, bento grids, dense scrollable content)
  • CSS custom properties for contextual theming
  • Mobile-first, always

Tech stack

Adapts to whatever framework you're using. When starting fresh, prefers Astro, SvelteKit, or Next.js with custom CSS. Never suggests Bootstrap.

License

MIT

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors