Skills for your agent

26 skills for Claude, Cursor or Codex, grouped by what they build. The ones by criterio.design read your project's criterio.md and build with its numbers.

Typography, color and layout

Web fontsby criterio.design
Typography: loading the families decided, and a fluid scale
npx skills add https://github.com/ericruizmolero/criterio-skills --skill fonts
Colour tokensby criterio.design
Colour: the palette as variables, light and dark, and contrast
npx skills add https://github.com/ericruizmolero/criterio-skills --skill color-tokens
CSS gridby criterio.design
Layout: grid, container queries, and spacing and radii as tokens
npx skills add https://github.com/ericruizmolero/criterio-skills --skill grid
Tailwindby criterio.design
The whole system as a Tailwind 4 theme
npx skills add https://github.com/ericruizmolero/criterio-skills --skill tailwind
beautiful-shadowsNewby MengTo
Depth, elevation and shadows that never turn muddy.
npx skills add https://github.com/MengTo/Skills --skill beautiful-shadows
adaptNewby pbakaus
Adapts a design across breakpoints, devices and platforms without losing the interaction.
npx skills add https://github.com/pbakaus/impeccable --skill adapt

Motion

GSAPby criterio.design
Smooth micro-animations, with the curves and durations of the Motion area
npx skills add https://github.com/ericruizmolero/criterio-skills --skill gsap
Native transitionsby criterio.design
Motion without a library: CSS, view transitions and scroll
npx skills add https://github.com/ericruizmolero/criterio-skills --skill transitions
apple-designNewby emilkowalski
Apple's way with interfaces and fluid, physical motion, brought to the web: gestures, springs, transitions.
npx skills add https://github.com/emilkowalski/skills --skill apple-design
interaction-designNewby wshobson
Micro-interactions, transitions and feedback patterns, designed and built.
npx skills add https://github.com/wshobson/agents --skill interaction-design
gsap-skillsNewIn criterio.mdby greensock
GreenSock's own: GSAP done right, from timelines and ScrollTrigger to SplitText and Flip, with cleanup in React.
npx skills add https://github.com/greensock/gsap-skills

Icons, logo and imagery

Icon setby criterio.design
Iconography: one library, one stroke, and how to draw the missing ones
npx skills add https://github.com/ericruizmolero/criterio-skills --skill icons
Logo as SVGby criterio.design
Logo: versions, clear space, favicon and share image
npx skills add https://github.com/ericruizmolero/criterio-skills --skill logo-svg
Responsive imagesby criterio.design
Imagery: formats, sizes, crops and one treatment
npx skills add https://github.com/ericruizmolero/criterio-skills --skill images
Isometric figureby criterio.design
Imagery: an object as an interactive isometric line drawing in SVG
npx skills add https://github.com/ericruizmolero/criterio-skills --skill iso-figure
iso-figureNewIn criterio.mdby MrBongoC
Draws an object as an interactive isometric line figure in one HTML file, with parts that work when pressed.
npx skills add https://github.com/MrBongoC/ai-iso-skill --skill iso-figure

Voice

Microcopyby criterio.design
Voice: buttons, errors, empty screens, forms and metadata
npx skills add https://github.com/ericruizmolero/criterio-skills --skill microcopy
Avoid AI slopby criterio.design
Voice: writing without the patterns of generated text (no-ai-slop, by Peter Yang)
npx skills add https://github.com/ericruizmolero/criterio-skills --skill no-ai-slop
no-ai-slopNewIn criterio.mdby petergyang
Peter Yang's: writes, edits and audits text so it doesn't read as generated.
npx skills add https://github.com/petergyang/no-ai-slop --skill no-ai-slop

Interface and components

frontend-designNewby anthropics
Anthropic's own: distinctive, production-grade interfaces that steer clear of the generic AI look.
npx skills add https://github.com/anthropics/skills --skill frontend-design
emil-design-engNewby emilkowalski
Emil Kowalski's design engineering: polish, components, animation and frontend craft ready for production.
npx skills add https://github.com/emilkowalski/skills --skill emil-design-eng
shadcnNewby shadcn-ui
The official shadcn/ui workflow: find, add, compose and fix components the right way.
npx skills add https://github.com/shadcn-ui/ui --skill shadcn

Review and accessibility

Accessibilityby criterio.design
The whole system: keyboard, focus, contrast and reduced motion
npx skills add https://github.com/ericruizmolero/criterio-skills --skill a11y
accessibilityNewIn criterio.mdby addyosmani
Addy Osmani's accessibility audit and fixes against WCAG 2.2.
npx skills add https://github.com/addyosmani/web-quality-skills --skill accessibility
design-reviewNewby Superfuture
A sharp, prioritised design critique of a URL, a screenshot or a component: hierarchy, type, spacing, colour.
npx skills add https://github.com/Superfuture/design-review --skill design-review
better-interfaceNewby jakubkrehel
A whole interface review: accessibility, layout, writing, type, colour and finish.
npx skills add https://github.com/jakubkrehel/skills --skill better-interface