Flatstack Back to the creator

Design preset

Depth is not available. Hierarchy still is.

No shadows, no bevels, no gradients. Size, colour and type carry the whole structure — which is a real constraint rather than a preference, because there is no elevation to fall back on.

0Shadows, anywhere
1Radius value
4Colour blocks
4.79:1Ink on the blue

What the preset decides

Three rules

No elevation

Not a soft shadow anywhere. Feedback is scale and colour, so a card that wants to look important has to be bigger or louder rather than floating.

Whole sections commit

Blue, emerald, amber, near-black. Colour groups the content instead of lines or boxes, and the transitions between them are sharp.

One radius

Eight pixels, everywhere. In a style this plain an inconsistent corner reads as a mistake rather than as variety.

The correction

White on colour is the reflex, and it fails

The source specification says white text on the blue is acceptable. Measured, it is 3.68:1 — below AA. On the emerald it is 2.56:1 and on the amber 2.15:1, both far below.

Dark ink on the same three fills measures 4.79, 9.1 and 9.8. So every colour block on this page — including the one you are reading — carries ink, and white appears only on the near-black section.

Pricing, as this preset renders it

Three tiers

Starter

$0

per month

  • One project
  • Community support
  • Core components
Choose

Studio

$24

per month

  • Ten projects
  • Priority support
  • Every component
  • Design export
Choose

Agency

$72

per month

  • Unlimited projects
  • Shared libraries
  • Client handover
Choose

Placeholder figures — shown to exercise the layout, not an offer

Questions

Frequently asked

Is this a mock-up or the real thing?
A specimen, hand-built to the preset's specification so the style can be seen whole rather than as a thumbnail. The preset itself is a set of WordPress Theme Settings; a generated site inherits the palette, the type and the single radius. The colour blocking and the decorative geometry are still being folded into the preset and are not all emitted automatically yet.
Why is there no white text on the coloured sections?
Because it fails. White measures 3.68:1 on the blue, 2.56:1 on the emerald and 2.15:1 on the amber — all below the four-and-a-half needed for normal text. Dark ink on those same fills measures 4.79, 9.1 and 9.8. The source specification says white on the blue is fine; it is the one correction this preset most needs.
How do I show that something is clickable without a shadow?
Scale and colour. Buttons grow five per cent on hover and shrink two on press; cards grow two. Focus is a solid three-pixel outline with an offset rather than a glow — with no elevation available, a soft ring would simply disappear.

Build a site in this preset.

Describe the business and your own AI agent builds it on WordPress with Unyson+ — real page-builder pages, with this design system applied site-wide.

Preview only Specimen page