SkillProof tested Claude skills

Antfu Design

Anvender antfu-stilens UnoCSS-konventioner med dobbelte lys/mørk-semantiske tokens.

Af antfu · antfu/skills

Testet · Virker ★ 8.0/10

Antfu Design — Anvender antfu-stilens UnoCSS-konventioner med dobbelte lys/mørk-semantiske tokens.

Hvad det gør

antfu-stilens designkonventioner, udvidet. UnoCSS-first, klassebaserede semantiske tokens med dobbelt lys/mørk til tooling- og devtools-UI'er, plus design-read, anti-slop og micro-interaction-finpudsning til landingssider og produktflader. Brug det, når du bygger eller refaktorerer en grænseflade med UnoCSS.

Testrapport

Installeret ordret (git clone + cp, gyldig YAML-frontmatter, alle 14 referencefiler til stede) og A/B-testet ved at bygge et tætpakket Vite Cache Inspector-devtools-panel med og uden skillet, verificeret i lys og mørk tilstand. Skillet anvendte ægte antfu-signaturer, som basisarmen manglede: filnavnet i en afdæmpet grøn accent (fremhævningen af 'aktivt modul' fra vite-plugin-inspect), op50/op-fade-opacitets-token-systemet, off-black #111 og fuld panelbredde. Basisarmen var kompetent og ren (endda strukturelt rigere med kolonneoverskrifter og en footer-optælling), så skillets gevinst var et beskedent, synligt skub mod antfu-idiomet snarere end et dramatisk finpudsningsspring.

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

Installation

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-designAnvender antfu-stilens UnoCSS-konventioner med dobbelte lys/mørk-semantiske tokens.

Skills udløses af almindelige forespørgsler — ingen kommandoer at huske. Efter installationen 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

Læs hele rapporten →