The gradient is safe here
Both stops carry white above five to one, which is unusual — most of the gradients in this set fail at their light end. That is what makes a gradient button reasonable in this style and reckless in several others.
Design preset
Authority, with one gradient that earns it
A cool near-white page, white cards, hairline borders and large blurred orbs that tint a section rather than draw attention. The indigo-to-violet sweep appears on primary actions and on one headline phrase — everywhere else it would be wallpaper.
Contrast reportAll passing
Ink on the page17.06:1
Indigo as text6.01:1
White on indigo6.29:1
White on violet5.70:1
White on emerald2.54:1
6.29:1White on the gradient's start
5.70:1And on its end
2.54:1White on the emerald
12pxCard radius
Three rules
The emerald is a status, not a button
White on it is 2.54 to one and the slate ink is 7.04. It belongs on a tick, a dot or a pill with dark text — never as a fill with a white label.
Muted text needs margin
The specified value is 4.55 to one — exactly the AA line. Darkening it slightly costs nothing and means a later change to the page tint cannot quietly push it under.
Three tiers
Placeholder figures — not an offer
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, and a
generated site carries the page tint, the indigo, Plus Jakarta Sans at three weights, the
12px radius and the hairline borders. The gradient fills, the blurred orbs and the dashboard
card are markup, so a section that wants them still asks for them.
Why is the emerald never a button?
Because white on it is 2.54 to one. It is the right colour for a success state and the
wrong colour for anything carrying a white label, which is exactly how the specification
uses it — the failure only appears when someone promotes it to an accent.
Why so few gradients?
Because a gradient signals importance by being rare. On the primary action and one
headline phrase it reads as emphasis; on every heading and card it becomes the background
noise it was meant to rise above.
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.