Lamp
A conic-gradient lamp that ignites and reveals a headline as it scrolls into view.
Build something
the world remembers
Installation
pnpm dlx shadcn@latest add "https://godui.design/r/lamp.json"Two mirrored conic gradients widen and brighten from a center seam while a glow
blooms beneath them. The children rise into the light in sync. Everything runs on
whileInView, so the lamp ignites once as the section scrolls into view — and
renders fully lit immediately under prefers-reduced-motion.
Usage
tsx
import { Lamp } from "@/components/godui/lamp";tsx
<Lamp>
<h2 className="text-4xl font-semibold">Your headline</h2>
</Lamp>Custom color
color accepts any CSS color and drives both cones and the glow.
tsx
<Lamp color="oklch(0.7 0.2 320)">
<h2 className="text-4xl font-semibold">Violet light</h2>
</Lamp>Props
| Prop | Type | Default | Description |
|---|---|---|---|
color | string | var(--primary) | Accent color of the light. |
Lamp also forwards every standard <div> attribute to the root element.