Traction scoreGitHub stars can be faked, so popularity alone can be misleading. Traction Score looks for broader signs of recent attention, adoption, and active maintenance.
This skill provides a framework for implementing responsive layouts using fluid declarations rather than rigid media query stacks. It helps frontend engineers build interfaces that adapt automatically across screen sizes while maintaining accessibility standards.
WHO IT'S FOR
Frontend engineers
implementing modern responsive layouts without breakpoints
UI/UX developers
improving accessibility and interaction states in CSS
Design system engineers
defining color tokens and spacing scales using oklch
Tailwind CSS users
applying logical properties and arbitrary values in Tailwind
Compatible AgentsThe repository documents support for these agents. The skills may also work with other agents that can load SKILL.md files, but they may need some setup or small changes.
Installs: Install good-css into the current project for the selected agent. · Claude Code, Codex, Cursor
Before you start
Run from: The project where the skill should be installed.
Run in a terminal from the target project. Replace <claude-code|codex|cursor> with one value: claude-code for Claude Code, codex for Codex, or cursor for Cursor. The --yes flag skips confirmation prompts.
One component's source and styles, pasted or identified by their actual project paths.
The project's target browsers.
Use the good-css skill to review the styles of the component I provide. Identify up to five concrete improvements using its rules for logical properties, fluid sizes, hover and focus states, and reduced-motion transitions. Show suggested edits in the project's existing styling system, and flag any browser-support concerns against the browsers I specify.
Claude
Codex
Cursor