xyz-fade-left
145Skill Claude CodeCodex
Fade Left — a composable AnimXYZ entrance via the xyz="fade left-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
5,151 tagged CSS and styling, measured the same way as everything else here.
Browse within: cursor-rules 20cursorrules 16modus 15trimble 15design-system 13nextjs 13css 11design-tokens 10component-library 7cursor-ai 7cursor-plugin 7fastapi 7vibe-coding 7design-language 6
Skill Claude CodeCodex
Fade Left — a composable AnimXYZ entrance via the xyz="fade left-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
Skill Claude CodeCodex
A coding guide for Makepad 2.0's layout system, which controls the size, position, spacing, alignment, and scrolling of interface elements.
Instructions file CodexOpenCode
Instructions for layoutit/polycss, covering polycss — agent guide, what this repo is, three-like parity surface, rendering model — the mental model and tag-as-strategy table.
Skill Claude CodeCodex
Build PolyCSS scenes that render 3D meshes, primitive shapes, or custom polygons as DOM/CSS polygon elements. Use when asked to create, port, debug, or explain PolyCSS code in vanilla JavaScript, React, or Vue.
Skill Claude CodeCodexCursor
Enforces project code conventions for Vue/Nuxt, TypeScript, styling (UnoCSS/SCSS), icons, composables, and commits. Use when writing or reviewing code in this repo, adding components, hooks, or styles, or when asked about project coding standards.
Skill Claude CodeCodex
Superdesign is a design agent, where it specialised in frontend UI/UX design; Use this skill before you implement any UI that require some design thinking.
Skill Claude CodeCodex
Frontend implementation skill for ima2 users. Use for any frontend, web UI, or visual implementation work — building, styling, or redesigning pages/components, responsive layouts, motion, component architecture, and production-surface polish. Pairs with ima2-uiux: load it first when design direction is vague; this…
Skill Claude CodeCodex
A web design workflow for turning a brief, reference website, screenshot, or keywords into a design specification and then web code. It covers visual style, page structure, interaction, responsive layouts, and motion.
Skill Claude CodeCodex
A skill for visual UI work, including changes to an existing project's appearance, design-system updates, and visual review. A design system is a shared set of interface styles and rules.
Cursor rule Cursor
A CSS styling guide for a uni-app project using UnoCSS, an on-demand utility-class system, and SCSS, a CSS extension language. It covers component styles, naming, shared variables, responsive layouts, and platform differences.
video-production-buddy/video-production-buddy
Skill Claude CodeCodex
Build scalable design systems with Tailwind CSS v4, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.
Skill Claude CodeCodex
Use when building, modifying, or fixing any frontend UI in the Asyar launcher — new components, new views, layout changes, styling decisions, new built-in features, visual bug fixes, and anything in settings or onboarding. Answers "what do I use here?" for fonts, colour, typography, spacing, motion, components, and…
Skill Claude CodeCodex
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. Applies when working with shadcn/ui, component registries, presets, --preset codes, or any project with a components.json file. Also triggers for…
Skill Claude CodeCodex
Implements Vibe Design System breaking changes with full workflow automation including component updates, migration guide updates, codemod generation, testing, and PR creation. Use when implementing breaking changes to Vibe components that require coordinated updates across the design system.
Skill Claude CodeCodex
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. Applies when working with shadcn/ui, component registries, presets, --preset codes, or any project with a components.json file. Also triggers for…
dereknguyen269/programing-best-practices
Skill Claude CodeCodex
Comprehensive design guide for web and mobile applications. Contains 67 styles, 96 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 13 technology stacks. Searchable database with priority-based recommendations.
Skill Claude CodeCodex
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
Skill Claude CodeCodex
Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components, working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors, typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle, hero section, cards, buttons…
Hook Claude Code
Runs after a tool call finishes for Edit, Write and MultiEdit tool calls, executing format-on-edit.mjs via node. From awdr74100/figwright.
Skill Claude CodeCodex
Use when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a frontend interface. Covers websites, landing pages, dashboards, product UI, app shells, components, forms, settings, onboarding, and empty states.…
Skill Claude CodeCodex
Generates and customizes Ignite UI for Angular themes including color palettes, typography, elevations, and component-level styles using the Sass theming system and the igniteui-theming MCP server. Use when users ask to theme, restyle, or style Ignite UI components, change colors or the color palette, switch between…
Skill Claude CodeCodex
Adapt designs to work across different screen sizes, devices, contexts, or platforms. Implements breakpoints, fluid layouts, and touch targets. Use when the user mentions responsive design, mobile layouts, breakpoints, viewport adaptation, or cross-device compatibility.
Skill Claude CodeCodex
Dark, immersive design with blue-purple gradient accents, sharp edges, and a deep navy background for a modern tech aesthetic.
Skill Claude CodeCodex
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
At most 3 mods per repository are shown here — the rest are on their repository pages: