Design preset
Built from light, not from fills.
A near-black canvas with soft pools of indigo drifting behind it, one accent used
only for interaction, and shadows stacked in layers rather than dropped in one. Precise, quiet,
and meant to feel like an application rather than a page.
4Background layers
3Shadows per surface
1Accent colour
200msInteraction
What the preset decides
A system of surfaces
The canvas is never a flat fill
A radial gradient for vertical depth, noise so a wide dark screen does not band, a
64 px grid for precision, and three slow-drifting pools of light. Remove them and what
is left is an ordinary dark mode — the layering is the style, not the darkness.
One accent
Indigo, for interaction and almost nothing else. An accent used decoratively reads as a
theme; used sparingly it reads as light.
Shadows in layers
A hairline, a soft diffuse, an ambient darkness — and a glow on the accent. One shadow
looks pasted on; three read as a surface sitting in space.
Small, swift motion
200–300 ms, expo-out, four to eight pixels. Never a bounce.
Interaction
Depth you can point at
Hover a card. A 300 px pool of
light follows the cursor across its surface, the border brightens by four percent, and the whole
thing lifts four pixels. Each change is small enough to feel like a response rather than an
animation.
Cursor-tracked light
A radial gradient positioned from the pointer, at fifteen percent opacity. It is the one effect that makes the surface feel physical.
A lit top edge
A single bright pixel along the top of every raised surface, fading out at both ends. Almost invisible, and the page looks cheap without it.
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 surfaces. The atmosphere on this page —
the drifting light, the cursor-tracked glow, the layered shadows — is still being folded into
the preset and is not all emitted automatically yet.
Is a dark page like this accessible?
With one caveat worth stating. Body text sits at about 15:1 and muted text at 6.3:1,
both comfortable. But the accent is split in two: the indigo fill carries white at 4.7:1 and
passes, while that same indigo as text on the canvas is only 4.32:1 and fails — so
accent type uses a brighter variant at 4.84:1. Using one value for both is the quiet failure
in this palette.
What happens with reduced motion?
The drifting light stops outright rather than merely running faster, and the lift and
scale are removed. Nothing on the page depends on movement to be understood.
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.