CSS & Styling Agent Skills

Scans frontend files, audits them for responsive layout issues, and applies minimal CSS/className fixes to prevent overflow at small window or mobile sizes.

Applies a battle-tested bilingual web-design system with typography, responsive rules, and performance patterns for Yuval Avidani's projects.

Provides frontend design direction, design systems, visual philosophy, and production-grade UI styling for web interfaces, including layout critique, usability auditing, and asset generation.

Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling across iOS, Android, and Web.

Guides implementation of AEM Edge Delivery blocks with JavaScript decoration and CSS styling, following established patterns and best practices.

Audits and upgrades existing websites and apps to premium quality by identifying generic AI patterns and applying high-end design standards without breaking functionality.

Provides portable CSS transitions for common UI patterns like dropdowns, modals, tooltips, and skeleton loaders. Each transition is a drop-in snippet with semantic CSS custom properties and a prefers-reduced-motion guard.

Creates a hero frame with looping CSS animations including a rotating type ring, animated globe, ticking timer, and parallax labels.

Builds elaborate, multi-component claude.ai HTML artifacts using React, Tailwind CSS, and shadcn/ui, with scripts to initialize and bundle projects into a single HTML file.

Provides foundational patterns for building type-safe frontend applications with Elm, covering The Elm Architecture, core language features, and Elm's approach to functional web development.

Builds distinctive, production-grade frontend interfaces with bold aesthetics, avoiding generic AI design patterns.

Creates elaborate, multi-component HTML artifacts using React, Tailwind CSS, and shadcn/ui, then bundles them into a single self-contained HTML file.