New Claudecore 4.0 — now with 34% less contrast

Ship the feeling
of good software.

H1 · font-weight 200 @ 89px · letter-spacing -0.035em. One word is set in an italic serif that appears nowhere else on the page, and carries the gradient. This word is chosen for rhythm, not meaning. Legibility below 15" is aspirational.

Claudecore is the design system for products that were described, not designed. Ultra-thin type, exactly four boxes, one gradient at 135 degrees, and absolute conviction. No research. No revisions. Live in a single prompt.

Subhead · 3 sentence fragments, then a 3-word verdict. The rhythm matters more than the claim. Notice that nothing here describes what the product does.
Three CTAs, descending in confidence. The third is a ghost button at 6% border opacity — rendered, tabbable, and effectively invisible. It is included because the layout looked unbalanced with two.

Trusted by teams that do not exist

Social proof · six invented companies at 50% opacity. Greyed-out logos read as "recognisable but unimportant," which is the exact feeling required. Each name is two syllables or a real word with the last letter removed.
99.99% Uptime measured across one afternoon
4 Boxes the correct number of boxes
200 Font weight any lower and it stops existing
12ms Time to gradient p50, unverified, gradient p99 unknown
Metrics band · four figures, none instrumented. Every number is gradient-filled and set in the display face at weight 200 so it reads as a headline rather than a measurement. The footnotes are the only honest text in this section, set at 10px where nobody will read them.

The system

Everything you need,
arranged in four boxes.

Three boxes looks unfinished. Five suggests you had opinions about your own product. Four is the only defensible number, and Claudecore enforces it at build time.

Thin Type Engine

Sets every headline at weight 200, minimum 72px. If a lowercase e survives a screenshot at 50% zoom, the compiler raises a warning and thins it further.

Gradient Authority

Violet to pink, 135 degrees, non-negotiable. Applied to one word per headline, selected at random. Attempting a second angle voids your licence.

Box Quorum

Features ship in fours. If you write a fifth, Claudecore silently merges it into the fourth and shortens the copy until the card heights match.

Decorative Cursive

Injects exactly one italic serif word per viewport. It will not match your typeface, your tone, or your industry. That is the mechanism, not a defect.

Feature grid · 4 columns, emoji as iconography. Emoji are used because a real icon set requires deciding what the product does. Every card is 3 lines of copy — not because there are 3 lines of substance, but because uneven card heights are the only failure state anyone notices.

Specimen sheet

The complete token set.

Everything the aesthetic requires, and nothing it doesn't. Laid out in a bento grid, because a bento grid signals that the tokens were considered.

Palette

One accent, stretched

gradient
#8B5CF6
#EC4899
#0F172A
#64748B

Two hues, 46 degrees apart, applied to every emphasis in the product. Semantic colour is not included; errors are also violet.

Weights

100 Thin 200 Ultra 300 (unused)

Weight 400 exists for body copy and is considered a compromise.

Radius

Four steps. Everything rounded. Sharp corners read as "enterprise", which is the wrong feeling.

Iconography

Ships as Unicode. Renders differently on every operating system, which is called warmth.

Elevation

glow-sm 0 0 0 1px violet/18 glow-md 0 24px 70px -24px aura radial, blurred, fixed

Shadows are replaced by coloured glow. Nothing casts light, but everything emits it.

Copy grammar

Verb. Adverb. Conviction.

Ship faster. — approved Scale smarter. — approved Built for teams that move. — approved Reduces onboarding time by 40%. — rejected, specific

Motion

Everything arrives from below

A 14px upward translate and a 700ms ease, triggered on scroll, applied to every section without exception. The effect is that the page appears to be still loading after it has loaded.

prefers-reduced-motion: honoured, reluctantly

Bento grid · 6-column, mixed spans. The bento is the aesthetic's way of showing many small things without ranking them. Note that no cell here is more important than any other — hierarchy is the first thing lost when the layout is chosen before the content.

Process

How a Claudecore site
gets made.

A genuine sequence. It takes about nine minutes and has never once been iterated on.

01 — THE BRIEF

"Make it look modern and clean"

Six words. This is the entire brief and it will not be revised. "Clean" is understood to mean "dark", "modern" is understood to mean "violet", and both are understood to mean "thin".

02 — GENERATION

Nine hundred lines, no pause

A hero, a stats band, four boxes, three testimonials, three prices, an FAQ. Nobody asked for an FAQ. The FAQ answers questions no user has ever had about a product that does not ship.

03 — LAUNCH

A domain bought at 1am

Deployed in forty seconds to a .dev nobody will renew. Posted once. Six people say it looks incredibly clean. Two of them ask what it does.

Numbered steps · 01 / 02 / 03. Numbering is load-bearing here — this is an actual sequence where order carries meaning. Elsewhere on the web it is applied to unordered lists purely because monospaced zero-padded numerals look considered.

The registry

Every specimen, catalogued.

An open registry of sites in the wild. Point your agent at a URL and it screenshots the page, scores it against the sixteen canonical tropes, and opens a pull request. The taxonomy is the product. The registry is just where it accumulates.

+ Rover — Uber for dogs, where the dogs are the driver 100 + Synthesis — AI-native workspace for modern teams 88 + Halcyon — the operating system for ambition 81

Contribute one in a single sentence.

> add rover.dev to the claudecore registry

The skill does the rest: fetch, screenshot, score, summarise, branch, PR.

Community section · a terminal snippet as social proof. A monospaced command in a dark box signals "developer product" faster than any screenshot. Note that the command is the shortest element in the section and does the most work.

Testimonials

Loved by people who
are not real.

“We replaced our entire design team with a 135-degree gradient and honestly? Same output, better margins.”

Marlow DeereHead of Vision, Nexora

“I couldn't read a single headline on my laptop. I have never felt so premium in my life.”

Priya VanthamFounder, Bytewell

“Claudecore shipped our landing page before we finished deciding what the company sold. We reverse-engineered the product from the four boxes.”

Ade FitzgeraldCTO, Cloudmesh
Three quotes, gradient-disc avatars, invented attributions. Names are generated to be plausible and unsearchable. Job titles skew senior because "Head of" is worth more than the quote. Nobody has ever clicked one of these to check.

Pricing

Three tiers. The middle one is correct.

The left tier exists to be rejected. The right tier exists to make the middle one look reasonable. You will pick the middle one. This has already been decided.

Starter

$0

For proving to yourself that you could have done this.

  • One page, four boxes
  • Single gradient, fixed angle
  • Emoji iconography
  • Community support (a Discord, quiet)

Enterprise

Let's talk

For organisations with a procurement process and no design opinion.

  • A second accent colour
  • SOC 2 badge (image only)
  • Custom emoji set
  • A dedicated contact who also does sales
Anchored three-tier grid · centre card scaled 1.045 and glowing. Classic decoy pricing: the outer tiers are structural, not commercial. Note "Most popular" — a claim of popularity made by a product with no users, printed on a badge nobody will verify.

FAQ

Questions nobody
asked.

Is Claudecore a real product?

No. It's a working specimen of a design language that has genuinely emerged — the house style of software that gets described to a model rather than designed by a person. Everything on this page is built the way the real ones are built. That's the whole argument.

Why is the type so thin?

Thin type reads as expensive. Weight 200 at 89px looks like a fashion house; weight 500 at 40px looks like a form. Neither is more readable, but only one gets screenshotted.

Do the buttons work?

They tell you the truth when you press them, which is more than most. There's no backend, no signup, no sales team. That fidelity is deliberate — a working checkout would break the specimen.

What is Inspect Mode?

The switch marked ⌗ in the header. It turns off the centering, drops the glow, and prints the annotation layer — a plain-language note under every element explaining what trope it is and why it's there. The page is the argument; Inspect Mode is the footnotes.

Can I actually use this aesthetic?

You already can, and it's fine. It's fast, it's legible enough, and it signals "recently built" to exactly the audience that cares. The failure isn't the gradient — it's reaching for the layout before you know what you're selling. Claudecore just makes that visible.

Accordion · 5 items, all closed by default. The FAQ is the section most reliably generated and least reliably read. It exists to add vertical length between the pricing table and the footer, so the page feels substantial when scrolled quickly.

One more gradient

Stop designing.
Start shipping vibes.

Join the waitlist for a product that will not be built, in a category that does not exist, at a price that has not been set.

No credit card. No product. No list.

Terminal CTA · restates the hero in imperative mood. The closing block always repeats the opening promise with more urgency and less information. The email field is the only input on the page and it goes nowhere.