Ink Bloom

Ink Bloom is a radial gradient that starts at indigo in the center and fades to near-black at the edges. Radial gradients focus attention, and this one behaves like a vignette: the bright indigo center is the natural home for a logo, a product shot, or a headline, while the dark edges disappear into a black page background. It is the right choice for launch pages that want drama without gradients bleeding across the whole viewport.

Because the center is six or seven times brighter than the edges, text placement decides the result. Put white or lavender text in the central indigo zone and avoid placing small copy near the corners where the dark values are deepest. The bloom has no angle, so it stays symmetrical; if the layout is diagonal-heavy, consider a linear gradient instead so the direction reinforces the composition.

The radial shape means the CSS is a radial-gradient with two stops, indigo in the middle and black at the rim. In a hero, the bright center can carry a logo or one headline word, but the further the text drifts from the middle, the more contrast drops. A simpler framing is a diagonal split where the canvas stays black and only the focal card carries the bloom. Because the outer edge ends in near-black, the gradient blends into a black page without a seam, which is the reason to pick it over a linear dark option.