Design & Styling Skills
Skills for designers and frontend developers — CSS refactoring, Tailwind conversion, UI component building, design system maintenance, and color palette generation.
CSS Refactorer
Clean up messy CSS — remove duplicates, enforce naming conventions, extract variables, and modernize legacy stylesheets.
Tailwind Converter
Convert vanilla CSS or styled-components to Tailwind utility classes automatically. Handles responsive prefixes and custom config.
UI Component Builder
Generate reusable UI components from descriptions or design specs. Outputs React, Vue, or plain HTML with accessible markup.
Design Token Generator
Create structured design token files (JSON, CSS variables, Sass maps) for colors, spacing, typography, and shadow scales.
Accessibility Checker
Audit HTML and React components for WCAG 2.1 AA violations — missing ARIA, low contrast, keyboard traps, and focus issues.
Color Palette Creator
Generate harmonious color palettes from a seed color or brand brief. Outputs accessible combinations with contrast ratios.