What it does
Point ACSS Pro at an image, raw HTML+CSS, or a live URL and it returns a validated ACSS config — palette, type ramp and space ramp — that passes contrast, scale and luminance checks. Nothing is written to your site until you approve it.
Key capabilities
WCAG AA contrast
Heading/body pairs are tested and corrected to pass AA.
Modular scale sanity
Type ramps are constrained to sane ratios (1.067–1.618).
Luminance gap
Neutral light/dark ramps must differ by ≥ 80% luminance.
Brand delta-E
Brand colors are checked so they never collapse into each other.
Drift audit
Rendered CSS is audited for drift away from your tokens.
Approval gate
Nothing is persisted until you review and approve the diff.
How it works
Point it at a design
A screenshot, raw HTML+CSS, or a live URL.
Extract & map
Colors, type and spacing map to ACSS palette, type ramp & space ramp.
Validate
Contrast, modular scale and luminance gaps are enforced.
Approve & persist
Review the diff, then write it to ACSS — only on your OK.
AI abilities
| Tool | Type | What it does |
|---|---|---|
| nibwp/acss-pro-from-design | write | Generate a full ACSS config from a screenshot, HTML+CSS or URL. |
| nibwp/acss-pro-detect | read | Detect the current ACSS setup and framework version. |
| nibwp/acss-pro-audit-site | read | Audit rendered CSS for drift from your ACSS tokens. |
| nibwp/acss-pro-validate-config | read | Validate a config against contrast, scale & luminance rules. |
| nibwp/acss-pro-update-variables | destructive | Persist approved palette, type & space variables to ACSS. |