gradientsdark

Amber Spotlight

Full-page view of this background so you can judge contrast, type, and chrome.

<div className="min-h-screen w-full bg-black relative overflow-hidden">  {/* Amber Spotlight Background */}  <div    className="absolute inset-0 z-0 pointer-events-none"    style={{      background: `        radial-gradient(          circle at center,          rgba(245, 158, 11, 0.12) 0%,          rgba(245, 158, 11, 0.06) 20%,          rgba(0, 0, 0, 0.0) 60%        )      `,    }}  />  {/* Your Content Here */}</div>

background.tsx17 lines · TSX

Related gradients

Cyan Meshdark Pulse Veildark Navy Voiddark Amber Horizondark Deep Washdark Deep Dual Glowdark

Back to library

Violet Spotlight Cyan Spotlight

gradientsdark

Amber Spotlight

Full-page view of this background so you can judge contrast, type, and chrome.

<div className="min-h-screen w-full bg-black relative overflow-hidden">  {/* Amber Spotlight Background */}  <div    className="absolute inset-0 z-0 pointer-events-none"    style={{      background: `        radial-gradient(          circle at center,          rgba(245, 158, 11, 0.12) 0%,          rgba(245, 158, 11, 0.06) 20%,          rgba(0, 0, 0, 0.0) 60%        )      `,    }}  />  {/* Your Content Here */}</div>

background.tsx17 lines · TSX

Related gradients

Cyan Meshdark Pulse Veildark Navy Voiddark Amber Horizondark Deep Washdark Deep Dual Glowdark