01
The Archive
A curated, searchable corpus of live website references—not downloadable templates.
- 304 public records
- Industry/category browsing
- Full-page captures and source links
Independent product anatomy · 31 August 2026
AllWebsites.Design, unpacked.
A searchable design archive, a source-aware intelligence layer, and a browser-native color workshop—mapped from homepage to record provenance, from HEX lookup to production CSS.
304published website references
25populated categories in the index
5 + 1live tools plus one announced
1,104color references in Chromary
38ready-made interface palettes
The product model
Archive → Intelligence → Workflow.
The public experience is designed as a loop: discover strong work, understand the decisions underneath it, then use those same concepts to make something of your own.
02
The Intelligence
A private extraction and governance engine turns each site into a structured comparison record.
- Design tokens and typography
- Technology signals with confidence
- Taxonomy, provenance and corrections
03
The Workflow
Free, no-signup tools translate the archive’s color language into practical design work.
- Find and transform color
- Build and preview systems
- Interpolate and export CSS
Every public surface
What’s where—and why it exists.
Filter by intent or search this section. Every route below was opened and inspected directly.
Live/
Homepage
The orientation layer: a global archive search, headline public counts, live-tool shortcuts, popular categories, recently studied sites, and the contribution doorway.
Archive searchTool launchpadCategory discoveryLatest records
Live/archive
Archive
The core discovery surface. Search queries match names and embedded record attributes—including technology terms such as “Webflow”—while category pills narrow the 304-card collection.
Text search25 populated categoriesStyle + tech discovery304 cards
Live/archive/[slug]
Website record
Each reference becomes a study page with source link, screenshot, summary, style, palette, typography, inferred stack, classification confidence, captured pages, contact signals and provenance.
Design DNAStack evidenceConfidence labelsCorrectionsSimilar sites
Live/c
Category atlas
Industry-led browsing with counts, percentages, descriptions and trending lanes. Individual category pages gather matching records and state that automated labels may need review.
Sector comparisonCounts + shareTrending lanesClassification note
Live/research/…
2026 Design Index
A transparent catalogue snapshot: category composition across 304 cleaned, deduplicated records plus methodology, caveats, and direct routes back into the evidence.
Category compositionMethodologyAccuracy caveatLiving snapshot
Coming next/blogs
Resources / Journal
Three editorial directions are previewed—display typography, near-black/off-white dominance, and what framework choice says about a team. The page currently says the first pieces are landing soon.
Editorial teasersArchive-derived analysisNewsletter intent
5 live/tools
Color toolkit
A six-job sequence—find, transform, build, preview, interpolate and test. Five are live; Palette Checker is announced as an upcoming role-and-contrast tester.
No signupBrowser-localProduction exportsShared language
Contribution loop
Users can nominate sites, report bad data, ask questions, or open press/partnership conversations. Both forms compose an email to hello@allwebsites.design rather than posting to an account system.
Site nominationPriority correctionsPartnership enquiriesNo account
Live/about + policy
Trust layer
About, Manifesto and Editorial Guidelines explain selection, governed taxonomy, source authority, honest unknowns and correction priority. Privacy and cookie pages expose collection and consent choices.
Selection criteriaIntegrity rulesPrivacy controlsSource authority
No matching surface. Try a broader word like “search”, “palette”, or “correction”.
The archive’s atomic unit
One website becomes a structured record.
The public page is not a scraped row. It is an assembled comparison object whose claims are separated from inference and whose provenance remains visible.
01 · Identity & classification
Official identityName, canonical source URL, record title
Editorial summaryNeutral description grounded in source evidence
TaxonomyCategory, subcategory, website type, audience
Aesthetic labelsExamples include Minimal, Brutalist, Playful, Editorial and Motion-Driven
02 · Visual design DNA
Full-page evidenceScrollable captures of the homepage and other key pages
PaletteRole labels, HEX values and relative representation
TypographyFont family, use (such as display), and observed size range
Comparison utilityVisual decisions can be compared across records instead of judged from a thumbnail alone
03 · Technology signals
Stack dimensionsFramework, CMS/builder, language, web server, hosting, CDN and ecommerce
Evidence boundarySignals come from headers, DOM markers and rendered evidence
Confidence languageDetected, likely, not detected or unknown—backend details are never guaranteed
Example“Static HTML / CSS / JS” and “Vercel” can be presented as likely rather than fact
04 · Confidence, contact & provenance
Classification confidencePercentages for dimensions such as website type and audience
Contact signalsDetected email and social presence—or an explicit “not detected” state
Record provenanceRecord ID, status, completeness, last checked and extractor version
Repair pathReport incorrect information; reviewed corrections override automation
05 · Discovery after the record
Similar sitesFour related records keep the browsing loop moving
Cross-surface routesCategories, tools, journal, research, submission and archive
Official-source escape hatchThe live website remains the authority for current business facts
Why it mattersIt creates a research trail without pretending the archive is the source of truth
The connected toolkit
Five live instruments. One shared color language.
Select a tool to see its job, controls, outputs and honest limitations. The illustrations below are explanatory, not embedded versions of the tools.
Search Sage, Cerulean, #7C3AED…⌕
Sage#BCB88A · Curated
Rebeccapurple#663399 · CSS
Turquoise#06C2AC · Survey
Find
Chromary
A source-aware color dictionary and perceptual matcher.
What the user can do
- Search 1,104 references by name or HEX, or jump to a random color.
- Filter CSS keywords, xkcd community-survey names, curated designer references, or include unfiltered survey language.
- Sort by relevance, A–Z, hue, lightness, chroma or source; browse by initial letter.
- Open a color drawer with HEX, RGB, HSL, OKLCH, luminance, source, alternate definitions and perceptually nearby names.
- Copy HEX/CSS values or pass the selection into Colorhyme.
How it works
Nearby matching converts colors to Oklab and ranks them with ΔEOK rather than raw RGB distance.
A color name is treated as a reference, not a universal truth. CSS is standardized; human naming sources can disagree.
#3389F9
Accent
#F9334F
#F9334F
Muted
#6E91BE
#6E91BE
Darker
#1678F8
#1678F8
Transform
Colorhyme
A deterministic, exact-angle HSL transformer for the moment after a base color is chosen.
What the user can do
- Paste HEX or use a visual color picker.
- Shift hue from −360° to +360° in 0.1° increments.
- Use relationship presets: 30° analogous, 60° wide analogous, 90° quarter turn, 120° triadic, 137.5° golden angle, 150° split and 180° complement.
- Reduce saturation and lightness with exact percentages.
- Choose a visibility-aware accent for very dark bases or preserve the exact HSL transformation.
- Copy base, accent, muted and darker colors—or copy the complete recipe.
Same input + settings = same output. HSL is intuitive but not perceptually uniform; equal numerical shifts may not look equally strong.
82 / 100 readiness
Primary
Secondary
Light neutral
Dark neutral
Accent
Build
WebPalette Studio
A role-based website color-system completer that protects the colors you already chose.
Input & analysis
- Add colors by name search, HEX, native picker, screen eyedropper, RGB or OKLCH; adjust brightness.
- Assign five jobs: Primary, Secondary, Light Neutral, Dark Neutral and Accent.
- Track a 0–100 readiness score as those roles and their contrast become usable.
- Lock user decisions and preserve supplied HEX values.
Completion & output
- Generate only missing roles; compare the same website before and after completion.
- Inspect role fitness, contrast and technical evidence through progressive disclosure.
- Copy semantic CSS variables.
The engine is deterministic—not prompt-based AI. It uses sRGB, OKLab/OKLCH, hue relationships, contrast, candidate generation, palette scoring and beam search.
Preview
Mockupalettes
A controlled interface test: the layout stays fixed while the four-color system changes.
What the user can do
- Paste four HEX colors; apply or reset the set.
- Assign Primary, Secondary, Accent and Dark roles—or use Auto-map as a starting point.
- Edit and copy each role directly.
- Search and filter 38 presets across Branding, Tech, Playful, Editorial, Travel, SaaS, Fintech, Minimal, Luxury, Organic, Food and Beauty.
- Preview desktop, tablet or mobile; compare A/B directions; hide controls for an unobstructed view.
Auto-map identifies the darkest color by luminance, then uses saturation to suggest the others. It is explicitly a heuristic—not a design rule.
linear-gradient(90deg in oklch shorter hue, #0000FF 0%, #FFFF00 100%)
Interpolate
TrueGradient
An OKLCH gradient builder and side-by-side interpolation laboratory.
Build & inspect
- Paste a HEX-based CSS linear-gradient or create stops from scratch.
- Add/remove stops, edit HEX and positions, search named colors, and set the angle.
- Switch OKLCH, sRGB or compare mode; drag an inspector and a split divider to inspect the same point.
- Choose shorter, longer, increasing or decreasing hue routes.
- Control fallback sampling from 9 to 129 points (default 33).
Ship it
- Copy native
in oklchCSS. - Copy a portable HEX-stop approximation with gamut mapping noted.
The endpoints, positions and angle stay fixed; only the interpolation path changes. Native output and sampled fallback solve different compatibility needs.
TEST
SOON
SOON
Test
Palette Checker
The announced sixth job: role and contrast testing.
Current state
The tools index labels this instrument “Soon” and “In progress.” No public control surface is available yet.
Place in the suite
It closes the workflow after interpolation by validating whether a color system survives semantic roles and contrast constraints.
Treat this as public roadmap intent, not a shipped capability.
1 · FindChromary
2 · TransformColorhyme
3 · BuildWebPalette
4 · PreviewMockupalettes
5 · InterpolateTrueGradient
6 · TestPalette Checker
What can a user do with it?
Start with a real job, not a feature list.
Choose a scenario. Each route combines archive intelligence and practical tools into a repeatable workflow.
Find a design direction without copying a homepage.
Use a sector, aesthetic and stack as comparison lenses, then take only the underlying decisions into your own work.
1
Search or choose an industry
Start broad: SaaS, portfolio, finance, studio…
Start broad: SaaS, portfolio, finance, studio…
/archive · /c2
Open several record profiles
Compare palette roles, type scale, style labels and technology.
Compare palette roles, type scale, style labels and technology.
/archive/[slug]3
Move from reference to experiment
Preview a color direction on a fixed interface.
Preview a color direction on a fixed interface.
MockupalettesTurn one or two brand colors into a website-ready system.
Preserve the identity; generate only the missing semantic roles; then judge the result at interface scale.
1
Name or verify the starting color
See competing definitions and copy the exact value.
See competing definitions and copy the exact value.
Chromary2
Explore deliberate relationships
Try analogous, triadic, golden-angle or complementary shifts.
Try analogous, triadic, golden-angle or complementary shifts.
Colorhyme3
Complete the five website jobs
Protect supplied HEX values and generate the missing roles.
Protect supplied HEX values and generate the missing roles.
WebPalette4
Judge area, hierarchy and context
Test the same palette on the same layout.
Test the same palette on the same layout.
MockupalettesTurn an ordinary gradient into an inspectable production choice.
Keep the endpoints fixed, compare color-space journeys, choose the hue route, then export for modern and fallback browsers.
1
Paste the CSS gradient
HEX-based linear gradients can be converted directly.
HEX-based linear gradients can be converted directly.
TrueGradient2
Compare sRGB and OKLCH
Inspect identical positions and midpoint measurements.
Inspect identical positions and midpoint measurements.
Compare mode3
Choose the hue path
Shorter, longer, increasing or decreasing.
Shorter, longer, increasing or decreasing.
4 routes4
Copy both delivery formats
Native OKLCH first; sampled HEX fallback second.
Native OKLCH first; sampled HEX fallback second.
CSS exportStudy how an industry presents itself.
Use the catalogue as a bounded research sample—not as a claim about the entire web.
1
Read the current index
Understand counts, exclusions and limitations.
Understand counts, exclusions and limitations.
2026 Index2
Open a populated category
See the full set and the classification caveat.
See the full set and the classification caveat.
/c/[slug]3
Compare common decisions
Palette, type, style and stack—not just hero imagery.
Palette, type, style and stack—not just hero imagery.
Record profilesHelp maintain the corpus.
The public correction loop is part of the product, not a buried support channel.
1
Nominate a reference
Supply URL, email and optional rationale.
Supply URL, email and optional rationale.
/submit2
Request a correction
Flag wrong, stale or miscategorised data.
Flag wrong, stale or miscategorised data.
/contact3
Understand the review bar
Real destination, usable capture and reference value.
Real destination, usable capture and reference value.
/editorial-guidelinesIndependent experience audit
Strong now. Tighten next.
This section separates observed strengths from seams worth resolving. “Verify” items are questions raised by public behavior—not accusations about internal implementation.
What is especially strong
StrongProduct coherence
The archive and tools share concepts—palette roles, typography, technology, evidence—so the suite feels like one system rather than a widget directory.
StrongEpistemic honesty
“Detected,” “likely,” “not detected” and “unknown” are treated as real product states. The official source remains authoritative.
StrongTraceable records
Record ID, status, completeness and extractor version make the archive inspectable and correctable.
StrongSemantic foundation
Sampled core pages had one H1, a main landmark, named controls and complete image alt text. The archive had 305 images with no missing alt attributes.
StrongSearch and crawlability
Next.js rendering, canonical URLs, Open Graph images and JSON-LD (Organization, WebSite, CollectionPage, ItemList, WebApplication and FAQPage) support discovery.
StrongLarge-gallery delivery
The archive exposes all 304 cards but uses Next image delivery; 303 of 305 images were marked lazy and all 305 used async decoding.
What deserves attention
Clarify25 categories vs 44 category routes
Homepage, footer and research index say 25 categories; the category atlas says 44 and includes several zero-count legacy/expansion lanes. Label “25 populated / 44 in taxonomy” or consolidate.
Clarify304 public records vs “5,896-record archive” copy
The archive page says the loaded set is 304 while a full 5,896-record production dataset connects behind it. Explain whether this is private corpus, future catalogue or environment-specific copy.
RepairThree legacy tool links return 404
Chromary currently links to /tools/palette-fixer, /tools/website-palette-checker and /tools/true-gradient. The live destinations use newer names/slugs.
RepairUnavailable email becomes
mailto:not foundAt least one sampled record turns an absent email value into an active mail link. Render plain “Not detected” when no valid address exists.
AlignTool-shell navigation and skip links
Core archive pages expose a skip link and primary navigation; sampled standalone tool shells generally do not. Carry the same accessibility affordances across the suite.
VerifyConsent copy vs AdSense script presence
The cookie page says ad tracking is not run today, yet the homepage DOM includes Google AdSense scripts before a choice was made. Script presence does not prove tracking; confirm gating and update wording if needed.
PlanScale beyond a 304-card DOM
Lazy images soften network cost, but the full archive still renders a large card tree. Pagination, incremental rendering or virtualisation may matter as the public corpus grows.
ShipResource teasers are not articles yet
The editorial topics are strong acquisition and authority material. Publishing them would complete the archive → research → education loop.
Route & capability matrix
The whole public footprint at a glance.
Use this as a compact operator’s map. “Local” means the tool says processing happens in the browser without signup.
| Surface | Primary job | User input | Output | State |
|---|---|---|---|---|
/archive | Discover references | Text query + category | Matching website cards | Live |
/archive/[slug] | Study a website | Record selection | Design, stack and provenance profile | Live |
/c | Compare industries | Category choice | Counts, share and records | Live |
/research/… | Understand the corpus | Reading / link navigation | Composition + methodology | Live |
/tools/chromary | Find color | Name or HEX | Values, source and nearby names | Live · local |
/tools/colorhyme | Transform color | HEX + hue/sat/light settings | 4 colors + reproducible recipe | Live · local |
/tools/webpalette | Build a color system | 1+ protected colors | 5 roles, readiness, preview, CSS | Live · local |
/tools/mockupalettes | Preview a palette | 4 colors / 38 presets | Responsive fixed-layout preview | Live · local |
/tools/truegradient | Interpolate a gradient | Stops, angle, hue route | Native OKLCH + HEX fallback CSS | Live · local |
| Palette Checker | Test roles and contrast | Not public yet | Not public yet | Announced |
/submit | Nominate a site | URL, email, rationale | Composed email to editorial | Live |
/contact | Correct or enquire | Name, email, reason, message | Composed email to editorial | Live |
Scope & method
What this guide does—and does not claim.
The website is a living product. Counts, routes and capabilities reflect the public site inspected on 31 August 2026.
Inspection coverage
- Homepage, archive, search behavior, category index and populated category page
- Representative record profile and its public data schema
- Tools index plus all five live tools and announced checker
- Research, resources, about, manifesto, editorial, submission, contact, privacy, cookies and 404 behavior
- Public semantic markup, structured data, image-loading strategy and legacy routes
Evidence boundary
This is a product and user-experience teardown based on public interfaces and client-visible behavior. It does not claim access to the private extraction engine, private datasets, server logs, analytics results or internal roadmap.
Observed inconsistencies are framed as verification or repair opportunities. They may reflect ongoing migration, unpublished data, or deployment differences.