css-skills

Claude Code skills that detect your design style and apply matching pure-CSS effects automatically

Claude Code Skill 0 KB JavaScript No SSR Issues MIT License
Result
Before vs After hover over the After panel →
❌ Without css-skills
📊

Analytics

Real-time metrics

🤖

AI Engine

Smart detection

Fast Setup

50+ connectors

✅ With css-skills
📊

Analytics

Real-time metrics

🤖

AI Engine

Smart detection

Fast Setup

50+ connectors

Smart Matching
Detects your style, picks the right effect
MINIMAL — Notion / Linear / Vercel
↑ Float · Underline From Center · Border Fade
BOLD — Stripe / Creative
✦ Feature card
↑ Sweep · Shutter In · Float Shadow
DARK PREMIUM — Raycast / Linear
⌘ Command palette
↑ Glow · Shadow Radial · Float Shadow
css-hover-effects
100+ effects · hover each one

👆 Hover over each card to see the effect

📊
Float + Shadow
Glow
Python
Pop (elastic)
Get started
Sweep To Right
🔔
Wobble
Documentation
Underline Center
Ripple Out
Try it free
Shutter In
css-micro-fx
Functional feedback · click & focus
Input Focus Effects
Button Click Effects
Loading States
Pillars
Overline
Dots
Task complete
Strikethrough