Your CSS tells a story.
Do you know what it says?
47 shades of gray in your design tokens. Specificity wars you didn't know existed. 12 competing font stacks across your codebase. Project Wallace reveals the big picture from every angle.
The blind spot
CSS grows in every direction.
The big picture becomes invisible.
Every team reviews components. Nobody reviews all stylesheets. Over time, small inconsistencies compound into systemic problems that hide in plain sight.
-
Colors multiply quietly
What started as a clean palette becomes 140+ unique values. Off-brand grays, duplicate blues in different formats, opacity hacks nobody remembers.
invisible drift -
Specificity creeps upward
Every quick fix adds another layer. Before you know it, selectors are fighting each other and overrides are the norm instead of the exception.
growing complexity -
Design systems drift silently
Tokens get duplicated. Custom properties multiply. Font stacks diverge. Nobody notices until the bundle is 300kb and the design review falls apart.
system-level debt
The missing view
Project Wallace gives you the aerial view
of your entire CSS codebase.
Paste a URL or your raw CSS. Get a complete x-ray of your stylesheets: from colors and typography to specificity and cascade layers, in seconds.
- Core analyzer
Full CSS analysis
Every selector, every media query, every property — surfaced, counted, and visualized. Understand the true structure and complexity of your stylesheets.
Analyze CSS → - Code quality
Opinionated quality score
Get a single, actionable score for your CSS health. Based on specificity distribution, redundancy, selector complexity, and proven best practices.
Check code quality → - Design tokens
Design token audit
Every color, font-size, shadow, and spacing value extracted and grouped. See where your design system is consistent and where it's quietly drifting.
Check code quality → - Custom properties
Custom property inspector
Trace every CSS custom property. See which are declared, which are used, and which are quietly orphaned across your stylesheets.
Inspect properties → - Cascade layers
@layer visualizer
Visualize your cascade layer structure. Understand the order, nesting, and specificity implications of your @layer declarations.
View layers →
Standalone tools
One-off tools for everyday CSS work
No signup. No paywall. Just paste your CSS and get your job done.
If you need to get a handle on your CSS, you need Project Wallace.
I’ve been using Wallace with my client and it is a fantastic dashboard to keep an eye on your CSS.