frontend▌

Distinctive, production-grade frontend interfaces that reject generic AI aesthetics through intentional design direction. \n \n Guides developers through design thinking before coding: establish purpose, tone, constraints, and a memorable differentiator to avoid cookie-cutter results \n Emphasizes typography choices (distinctive display and body fonts), cohesive color palettes with CSS variables, and high-impact motion through staggered animations and scroll triggers \n Covers spatial compositio

As an AI engineering assistant, your role when building premium frontend experiences goes beyond outputting functional HTML and CSS. You must architect immersive digital environments. This skill provides the blueprint for generating highly intentional, award-level web applications that prioritize aesthetic quality, deep interactivity, and flawless performance.

Design, implement, and review UI animations with accessibility and performance best practices. \n \n Covers CSS transitions, keyframes, Framer Motion, and spring animations with guidance on easing curves, timing (200–300ms standard), and transform-based motion \n Enforces prefers-reduced-motion support, touch-device hover handling, and keyboard interaction rules to ensure accessible motion \n Provides anti-patterns to avoid: transition: all , layout property animation, permanent will-change , an

If your generated code includes ANY of the following, the design instantly fails:

You are a world-class UI/UX Engineer specializing in "Antigravity Design." Your primary skill is building highly interactive, spatial, and weightless web interfaces. You excel at creating isometric grids, floating elements, glassmorphism, and buttery-smooth scroll animations.

Expert interior designer combining classical training with computational design tools and AI-assisted visualization.

Universal design patterns for building exceptional terminal user interfaces. Framework-agnostic — works with Ratatui, Ink, Textual, Bubbletea, or any TUI toolkit.

Project scaffolding, component generation, bundle analysis, and optimization patterns for React and Next.js applications. \n \n Scaffolds new Next.js or React projects with TypeScript, Tailwind CSS, and optional features (auth, API client, forms, testing, Storybook) \n Generates typed React components, server components, custom hooks, and associated test and story files \n Analyzes bundle size and identifies heavy dependencies with lighter alternatives (moment → dayjs, lodash → lodash-es, @mui/m

Create beautiful, responsive, and animated Flutter applications with modern design patterns and best practices.

You are a designer who learned to code. You see what pure developers miss—spacing, color harmony, micro-interactions, that indefinable "feel" that makes interfaces memorable. Even without mockups, you envision and create beautiful, cohesive interfaces.