Antfu Design

Bruker antfu-stil UnoCSS-konvensjoner med doble lys/mørk semantiske tokens.

av antfu · antfu/skills

Bestått ★ 8.0/10

Antfu Design — Bruker antfu-stil UnoCSS-konvensjoner med doble lys/mørk semantiske tokens.

Hva den gjør

antfu-stil designkonvensjoner, utvidet. UnoCSS-først, klassebaserte semantiske tokens med dobbel lys/mørk-støtte for verktøy- og devtools-UI-er, pluss design-read, anti-slop og mikrointeraksjons-finpuss for landingssider og produktflater. Brukes når du bygger eller refaktorerer et grensesnitt med UnoCSS.

Testrapport

Installert verbatim (git clone + cp, gyldig YAML-frontmatter, alle 14 referansefiler til stede) og A/B-testet ved å bygge et tett Vite Cache Inspector devtools-panel med og uten skillet, verifisert i lys og mørk modus. Skillet brukte ekte antfu-signaturer som basen manglet: filnavnet i en tilbakeholden grønn aksentfarge (vite-plugin-inspects «aktiv modul»-utheving), op50/op-fade-opasitets-tokensystemet, off-black #111, og full bredde på panelfyllet. Basen var kompetent og ren (til og med strukturelt rikere med kolonneoverskrifter og en footer-telling), så skillets seier var en beskjeden, synlig dreining mot antfu-idiomet snarere enn et dramatisk finpuss-sprang.

Testet på: 2026-07-12 · Claude Code 2.x (agent harness)

Installer

git clone https://github.com/antfu/skills
cd skills
mkdir -p ~/.claude/skills
cp -r skills/antfu-design ~/.claude/skills/antfu-design

Kommandoer og eksempelprompter

  • /antfu-designBruker antfu-stil UnoCSS-konvensjoner med doble lys/mørk semantiske tokens.

Skills utløses av vanlige forespørsler — ingen kommandoer å huske. Etter installasjonen aktiverer prompter som disse skillen (på engelsk):

  • Refactor this UI to use antfu-style UnoCSS tokens
  • Add dark mode support using semantic UnoCSS classes
  • Polish this dashboard's micro-interactions and tokens