A near-black sphere with a cyan key rim and a warm coral fill on opposite edges, built from layered box shadows. A palette or OKLCH color overrides reskin both lights without moving the geometry.
The source comes with full access.
One payment of $149 ($49 for now) opens the source right here and lets the CLI install every paid component, with lifetime updates.
pnpm dlx shadcn add @01orbital/painted-orb-rimnpx shadcn add @01orbital/painted-orb-rimyarn shadcn add @01orbital/painted-orb-rimbunx --bun shadcn add @01orbital/painted-orb-rimPart of the 01orbital library. With a license, put ORBITAL_TOKEN in .env.local and the same command installs it (licensed install, pricing).
It lands at components/orbs/painted-orb-rim.tsx, as source you own and edit.
import { PaintedOrbRim } from "@/components/orbs/painted-orb-rim"
// The palette is the knob: key light, fill and rim.
const PALETTE = {
key: "oklch(0.905 0.040 251.6)",
fill: "oklch(0.450 0.155 251.6)",
rim: "oklch(0.840 0.075 251.6)",
} as const
export default function PaintedOrbRimDemo() {
return <PaintedOrbRim palette={PALETTE} />
}Prop
Type
It also accepts the HTML attributes of the element it renders.
npm: cn. The CLI installs them for you.
No other registry pieces.
Painted Orb
A large painted sphere filled with any CSS gradient, warm amber by default, under two noise grain layers with a lit lower limb and outer glow. Glow intensity scales down to a bare limb line.
Painted Orb Rim Scene
A full-bleed art layer that centres a Painted Orb Rim sphere on a near-black ground, to sit behind content inside a relative parent. The ground can be turned off to layer it over another scene.