Lamp
A lamp effect as seen on linear, great for section headers.
Build lamps the right way
Installation
Usage
import { Lamp } from '$lib/components/ori/lamp';<Lamp />Examples
Default
<Lamp>
<h2 class="text-4xl font-semibold">
Beautiful section headers
</h2>
</Lamp>Custom Colors
You can customize the glow and line colors using glowClass and lineClass.
<Lamp
glowClass="bg-purple-500"
lineClass="bg-purple-500"
>
<h2 class="text-4xl font-semibold text-white">
Purple Glow
</h2>
</Lamp>Subtle Variant
<Lamp
glowClass="bg-accent/40"
lineClass="bg-accent/60"
>
<h2 class="text-3xl font-medium">
Subtle Lamp
</h2>
</Lamp>Props
| Prop | Type | Default | Description |
|---|---|---|---|
class | string | — | Additional classes for the root container |
glowClass | string | bg-accent | Tailwind class for the glow color |
lineClass | string | bg-accent | Tailwind class for the horizontal line |
children | Snippet | — | Content rendered inside the lamp |