Bottom Blurred Gradient With Noise

Background Pattern 100Pro

A full-height section with two large bottom-corner radial gradients, heavy blur, desaturated SVG noise on top, and centered pattern placeholder.

Shadcn UI Background Pattern Block

BackgroundPattern100 is a full-screen backdrop built with shadcn/ui. Two very large radial gradients sit at the lower left and lower right, borrowing chart-1 and chart-2 with boosted chroma steps, then a long blur merges them into a wide floor of color. A full-bleed SVG noise layer with grayscale turbulence and overlay blend adds grain. PatternPlaceholder centers your UI.

This variant pushes saturation and blur harder than lighter mesh patterns, so the bottom band can read almost like colored fog. Useful for hero sections that need presence without illustrations.

Moderate GPU cost from blur radius; pair with simple foregrounds. Theme through chart variables; no raster files.

className on the outer section controls min-height and flex centering around the placeholder.

Dependencies

PackageType
pattern-placeholder
@shadcnblocks
Registry