Back to the catalog

frontend-design

mager/frontend-design · skills.sh

Open source Repository Open in the app JSON README (API)

About

Skill publicada por mager/frontend-design no skills.sh. Instale com: npx skills add mager/frontend-design@frontend-design

Details

Kind
Agent skills
Topic
No topic detected
Publisher
mager
Origin
skillssh
Category
ferramentas
Stars
4
Last push
2026-04-25T16:05:51Z
Repository state
ativo
Added
2026-08-30 15:22:21
Updated
2026-09-08 15:04:47
Origin id
mager/frontend-design/frontend-design

README

# frontend-design

A frontend design skill for [Claude Code](https://claude.com/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

```bash
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

More