SaglitzDesign

The one-call foundation. Brand color + vibe + platform → a complete, coherent starter: WCAG-verified color (light + dark), matched fonts, an icon library, a type scale, an elevation ramp, ready-to-paste tokens, the components to build and a checklist.

Start here for process. A phased, expert process for your project type — each phase with a goal, exit criteria and the exact docs to read.

Natural-language search across everything, returning the most relevant section of the best-matching docs.

Fetch any document in full by id.

Deep dive on a component or screen — button, form, paywall, hero, pricing — with specs and real-world patterns.

Full platform references: Material 3, Liquid Glass, iOS / Android / macOS, Fluent 2, web trends, design tokens.

Curated real-world examples of a pattern from top apps and sites, each with notes on what it does well and a link to the source screen.

An assembled audit checklist per project type and focus: UI, UX, accessibility, SEO, GEO, conversion, copy.

Technical SEO and GEO guides, optionally narrowed to a topic.

Production-ready, accessible component code — button, input, modal, card, tabs and more — in React/Tailwind, HTML/CSS, SwiftUI or Compose, with every state and ARIA baked in.

Turn a color/spacing/type spec into real token files: CSS variables, Tailwind v4, SwiftUI, Compose and W3C DTCG JSON — one source of truth across platforms.

One brand color → a full 50–950 tonal scale, a neutral ramp and light + dark semantic tokens, every pair WCAG-verified and auto-corrected.

A modular type scale (base × ratio) → named steps with line-heights, tracking and fluid clamp(), as CSS variables + Tailwind.

A cohesive layered box-shadow ramp (flat → modal) as CSS variables + Tailwind, with dark-mode guidance.

Easing + duration tokens and paste-ready keyframes (fade / slide / scale / spring / shimmer) in CSS, Framer Motion or SwiftUI — reduced-motion included.

Curated production font pairings for a vibe — heading + body (+ mono) with paste-ready CSS stacks, weights, rationale and a type scale.

Recommends the right icon system for a vibe / platform — Lucide, Phosphor, Solar, SF Symbols… — with license, install, coverage and usage rules.

Deterministic WCAG 2.2 checks: exact contrast ratios and per-platform tap-target sizes, with pass/fail and fixes — before you write code.

Repairs a failing color pair: the nearest accessible color (hue/saturation preserved) that meets your WCAG target — the corrected value, not just a report.

Lints an HTML / CSS / JSX / Tailwind snippet for design & a11y anti-patterns — hardcoded values, killed focus, missing labels, clickable divs — with line numbers and fixes. Tag-aware, so formatting never changes the verdict.

Objective copy audit — readability, sentence length, passive voice, jargon, filler, weak CTAs — with flagged phrases and fixes.

Measures a real screenshot from its pixels: the true palette and colour count, exact WCAG contrast ratios for the pairs on screen, density, and structural detections — alignment, rhythm, off-grid gaps — each with a confidence level. Returns a self-contained HTML report you can open and share.

Audits a real codebase instead of a snippet. Point it at a directory: it walks your design source, lints every file, and scores the whole project for consistency — cross-file drift being exactly what a single-file lint cannot see. Findings ranked worst-file-first with file:line, plus an explicit list of what it did not look at.

Point it at real CSS or JSX and get a consistency score plus the sprawl behind it: how many distinct colours, sizes, radii and shadows are actually in use, which colours are indistinguishable duplicates, what sits off the 4pt grid, and how much goes through tokens.

Already have a design system? Paste your CSS custom properties, shadcn :root block, DTCG file or theme JSON and get back the roles it names, the roles it leaves undefined, a WCAG check on the pairs it defines, and the whole set re-emitted as CSS, Tailwind, SwiftUI, Compose or DTCG. The inverse of generate_design_tokens — take a web theme to iOS, or audit an inherited one.

Breakpoints, container widths, a column grid, container queries and a fluid section-rhythm scale — as CSS custom properties and a Tailwind v4 theme.

How iOS, Android, macOS and the web each solve one surface — navigation, buttons, sheets, motion, forms — with the rules for porting between them and an explicit do-NOT-port list.

Browse the full knowledge index by category and platform.

Reports each doc's age against a staleness threshold, so the base stays current.

Audits a real codebase instead of a snippet. Point it at a directory: it walks your design source, lints every file, and scores the whole project for consistency — cross-file drift being exactly what a single-file lint cannot see. Findings ranked worst-file-first with file:line, plus an explicit list of what it did not look at.