Design Credits Counter
November 13, 2025A tool that counts your design credits. Tracks font sizes, colors, spacing values, weights. Shows a score. Makes constraint philosophy visible and gamified.
This idea came from Lee Robinson and Brian Lovin.
The Tweet
The Philosophy
Design systems exist to create consistency and reduce cognitive load. But without visibility into constraint usage, drift happens silently. You start with 4 grays and end with 12. You plan for 3 font sizes but use 8. The system becomes a suggestion, not a constraint.
Design credits make constraint philosophy visible. Every unique value costs a credit. Not every instance, but every unique choice. This shifts focus from "am I using the right component?" to "am I creating unnecessary variation?"
The goal isn't zero credits. It's intentional credits. A complex dashboard might need 12 spacing values. A brand refresh might need 8 grays. The tool doesn't judge. It illuminates. You see the cost of each decision, then decide if it's worth it.
How It Works
Every design decision costs credits. A new font size costs one credit. A new gray costs one credit. The tool tracks unique values, not instances. Using 16px text 50 times counts as 1 credit. Using 16px, 18px, and 20px counts as 3 credits.
The score aggregates font sizes, colors, spacing values, and font weights into total credits. Lower is better.
Real-Time Tracking
Updates happen live as you design. Change a text size and it counts. Add a new color and it counts. No manual tracking required.
Breakdown
See where credits are spent. This design uses 8 different grays. Is that intentional or drift? The tool shows you the breakdown so you can decide.
Gamified
Constraints become a game. Can you design this page with fewer credits? Reuse that gray instead of creating a new one. The score makes trade-offs visible.
Sometimes you need more credits. A complex dashboard might need 12 spacing values. A brand refresh might need 8 grays. The tool doesn't judge. It reports. You decide if it's intentional.
Awareness
Most designers know they should use a design system. Most don't. The tool doesn't enforce. It illuminates. You see your drift in real numbers. Using 12 different spacing values becomes actionable.
Comparison
Compare your design to others. This file uses 60 credits. The design system file uses 25. That gap tells a story. The numbers make it visible.
What Gets Tracked
Font sizes, colors, spacing values, and font weights are tracked. Could extend to border radius, shadows, and opacity. Any design token that can drift. The tool tracks unique values, not instances.
Track design credits in real-time as you design. See your score, breakdown, and live updates directly in Figma.