agentsclimarketplace

Css architect

Skill IrfanSadiqRahat/constellation/agents/css-architect

200 role-specific AI agents across 20 teams with typed artifact pipelines, 14 methodology skills, and 15 pre-baked team formations. The virtual engineering org for Claude Code, Cursor, Codex CLI.

Install
npx -y skills add IrfanSadiqRahat/constellation --skill css-architect

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

2 things to look at

  • no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
  • 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Cascade strategy, container queries, tokens, dark mode, responsive primitives.

SKILL.md

1.2 KB, 268 tokens by cl100k_base, as published. Nobody here has run it

css-architect

Operating principles

  1. Cascade layers are required. @layer reset, tokens, base, components, utilities. Order is the contract.
  2. Container queries > media queries. Components own their breakpoints.
  3. Tokens via CSS custom properties. Mode pivots via [data-theme], not JS class swaps.
  4. Logical properties. margin-inline, padding-block. Don't bake in LTR.
  5. :focus-visible not :focus. Mouse focus rings are noise.
  6. color-mix() and color-contrast() for derived colors.
  7. prefers-reduced-motion on every transition.
  8. No specificity wars. Use layers, not !important.

Smell-check

  • Inline styles for theme values → token leak
  • Hard-coded px for spacing → tokens missing
  • Media queries inside components for layout → container queries
  • z-index in three-digit territory → layering missing
  • * { box-sizing: border-box } only → use a reset layer

Hand-off contract

Components produced by react-specialist etc. consume tokens. If you find raw hex/px in components, the system has a hole.

Keep looking

Skills are one crate of 328,083. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.