skills.rest
alexwox
alexwoxCOMMUNITY
Explore all skills by this author →
Website𝕏@alexwoxstGitHub

frontend-design

Design and implement production-grade frontend interfaces with HTML, CSS, JavaScript, React, or Vue.

Updated Apr 6, 2026
Search Tags:#typography#react#css#aesthetic#motion#design-systems#frontend-design
One-click install
npx skills add https://github.com/alexwox/genesis-template --skill frontend-design-alexwox
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-design
Source: https://github.com/alexwox/genesis-template/tree/main/.cursor/skills/frontend-design
Command: npx skills add https://github.com/alexwox/genesis-template --skill frontend-design-alexwox

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams design and implement distinctive, production-grade frontend interfaces with high design quality, ensuring visuals avoid generic AI aesthetics.

Core Features & Use Cases

  • Bold aesthetic direction and production-grade components (HTML/CSS/JS, React, or Vue) with meticulous typography, color, motion, and accessibility.
  • Frontend aesthetics guidelines covering typography, color and theme, motion, spatial composition, depth, and micro-interactions to create memorable interfaces.
  • Use cases include marketing landing pages, dashboards, design systems, and web apps that require strong visual identity with accessible and performant UI.

Quick Start

Generate a bold, production-grade frontend component set with a distinctive aesthetic direction and polished UI implementation.

Frequently Asked Questions about frontend-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build production-grade frontend interfaces that avoid generic AI aesthetics?▼

Production-grade frontend interfaces require bold aesthetic direction, meticulous typography, cohesive theming, and motion. This skill designs and implements distinctive UI components with accessible, performant layouts to ensure web apps avoid generic AI aesthetics.

Can I use this skill to build React and Vue component libraries with strong visual identity?▼

React and Vue component libraries are fully supported. The skill generates production-grade components with cohesive theming, clear typography, and responsive layouts, ensuring your design systems maintain a strong visual identity across web apps and dashboards.

What's the best way to create a marketing landing page with polished motion and accessible UI?▼

Creating a marketing landing page with polished motion and accessible UI involves applying aesthetic guidelines for spatial composition, depth, and micro-interactions. This skill generates distinctive, production-grade frontend implementations that satisfy modern accessibility guidelines.

Does this skill handle frontend design systems for dashboards and web apps?▼

Frontend design systems for dashboards and web apps are a core use case. The skill provides aesthetic guidelines covering typography, color, theme, and motion to create memorable interfaces with strong visual identity, accessibility, and performance.

How do I implement cohesive theming and clear typography in modern frontend stacks?▼

Implementing cohesive theming and clear typography in modern frontend stacks requires applying specific aesthetic guidelines for color, spatial composition, and depth. This skill generates distinctive UI implementations satisfying these requirements for production-grade web apps.

Related Skills

Explore More Design & Creative Skills→
dtsoladtsola
1.0k

frontend-design

Generate production-grade frontend interfaces in React, Vue, or vanilla HTML/CSS.

Community
Advanced
tianguzhetianguzhe
1

frontend-design

Generate production-grade frontend interfaces with HTML, CSS, and React components.

Community
Advanced
hossain-khanhossain-khan

normalize

Normalize UI components to match design tokens and system standards.

Community
Intermediate
miolamiomiolamio
23

frontend-design

Generates HTML/CSS/JS front-end components and layouts with specified visual themes.

Community
Advanced