A half-dome orb: the top half of a disc in a warm gradient with a glowing limb border, on a transparent ground. Children render between the paint and the limb, and the composition crops it at a horizon.
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/rising-orbnpx shadcn add @01orbital/rising-orbyarn shadcn add @01orbital/rising-orbbunx --bun shadcn add @01orbital/rising-orbPart 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/rising-orb.tsx, as source you own and edit.
import { RisingOrb } from "@/components/orbs/rising-orb"
// The dome sits on the bottom edge so it reads as rising over a horizon.
export default function Demo() {
return (
<div className="relative isolate grid min-h-full w-full flex-1 place-items-center items-end overflow-hidden bg-background text-foreground">
<RisingOrb size="min(60%, 720px)" />
</div>
)
}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.
Planet
A colored sphere: two stacked color fields, blurred and wrapped into a ball by a vignette, lit from the top. Takes any of the nine Orb Palettes by name, or your own. Holds its form from 16px to 400px; circle or squircle, for marks, app icons and favicons.
Rising Orb Scene
A full-bleed sunrise layer: a warm Rising Orb cut by the bottom edge, a hairline horizon, grain on the disc and a limb glow over a dark sky. Gradient, limb color and size are adjustable.