meridian

Auto-fix detectable accessibility issues.

Full accessibility audit. Focus, semantic HTML, ARIA, contrast, touch targets, motion safety.

Verify visual alignment across sections. Check consistent left edges, centered elements, grid alignment.

Add purposeful motion. Page load reveals, hover states, scroll entries.

Audit ARIA attributes. Ensure proper usage without over-specification.

Comprehensive design quality report with specific findings per axis, line references, severity ratings, and fix instructions.

Amplify safe designs. Larger headlines, stronger accent, more shadow, one animation.

Generate responsive breakpoint tokens: sm through 2xl.

Pass/fail against a DNA threshold. For CI/CD pipelines.

Find every color not in the palette or token system.

Replace orphan colors with nearest system token.

Compare DNA profiles across branches, versions, or projects.

WCAG contrast matrix. Test every text token against every surface token.

Generate dark mode from the existing palette. Not inversion — proper surface remapping.

Add 1-3 memorable micro-interactions. Use sparingly for maximum impact.

Audit visual density and whitespace balance across sections.

Strip to essential form. Remove every element that doesn't earn its place.

Detect drift from the DNA baseline. Shows what changed since the last /m-scan.

Auto-fix drift violations. Bring code back in line with the DNA profile.

Export the design profile as CSS custom properties with dark mode overrides.

Export the design profile as W3C Design Tokens JSON format.

Export the design profile as SCSS variables and mixins.

Export the design profile as a Tailwind CSS configuration.

Analyze reading order and content flow. Verify logical DOM order matches visual order.

Generate focus ring system from the accent color.

Snap all spacing values to the 4px base grid. Replaces arbitrary values with the nearest scale token.

Add error states, loading states, i18n safety, edge cases using system tokens.

Add a complementary or analogous accent color computed from the brand.

Audit visual depth. Count distinct heading levels, weight differentiation, size ratios.

Map all layout patterns. Identify grid/flex, spacing, nesting depth, responsive breakpoints.

Auto-fix layout issues. Snap spacing, add max-width, normalize gap usage.

Check line lengths across the interface. Optimal: 45-75 characters per line.

Generate motion tokens: 6 duration steps and 5 named easing curves for consistent animation.

Audit nesting depth. Maximum 4 levels of visual containment.

Align every value in the codebase to the nearest system token from the profile.

Push past conventional limits. WebGL, spring physics, GPU effects. Maximum one per page.

Generate a full 50-950 shade palette from a single hex color. 11 perceptually uniform shades via HSL interpolation.

Final quality pass. Alignment, spacing, hover states, focus, loading states, consistency.

View the current .meridian.json design profile. Shows all 8 axis scores, detected patterns, and DNA hash.

Tone down aggressive designs. Softer colors, smaller contrasts, more whitespace.