Skip to Content
Get full access

Limb Scene

Planet horizon space background: an eclipse disc with corona above a curved horizon glow on a dark sky, with grain. Five named framings set positions and sizes for sci-fi and astronomy heroes; renders children on top.

pnpm dlx shadcn add @01orbital/limb-scene

Usage

import { LimbScene } from "@/components/scene/limb-scene"

// The scene has no height of its own; the frame gives it the whole stage.
export default function LimbSceneDemo() {
  return <LimbScene framing="meridian" className="absolute inset-0" />
}

Examples

New

limb-scene-fluid-framing

limb-scene-fluid-framing

Fluid Framing

Limb Scene example: a night sky with a small eclipse disc above a curved planet horizon, framed to scale smoothly with its container. Shows the fluid framing for responsive planet backgrounds.

pnpm dlx shadcn add @01orbital/limb-scene-fluid-framing

New

limb-scene-panel-framing

limb-scene-panel-framing

Panel Framing

Limb Scene example framed for a fixed-size panel, a night sky with the glowing disc set toward the upper right. Shows the panel framing of the planet horizon space background.

pnpm dlx shadcn add @01orbital/limb-scene-panel-framing

New

limb-scene-meridian-framing

limb-scene-meridian-framing

Meridian Framing

Limb Scene example with a very wide, gently curved horizon, so the planet reads as a flat arc across the frame. Shows the meridian framing of the planet horizon space background.

pnpm dlx shadcn add @01orbital/limb-scene-meridian-framing

New

limb-scene-nightside-framing

limb-scene-nightside-framing

Nightside Framing

Limb Scene example with a stronger glow around the disc, for a moody view from the planet's night side. Shows the night-side framing of the planet horizon space background.

pnpm dlx shadcn add @01orbital/limb-scene-nightside-framing

New

limb-scene-inset-framing

limb-scene-inset-framing

Inset Framing

Limb Scene example with a small eclipse disc tucked into the upper right corner, leaving open room for text. Shows the inset framing for a space hero background with copy.

pnpm dlx shadcn add @01orbital/limb-scene-inset-framing

New

limb-scene-large-eclipse

limb-scene-large-eclipse

Large Eclipse

Limb Scene example: a night sky with a big eclipse disc and wide corona, centered above a lower horizon. Shows the large eclipse option of the planet horizon space background.

pnpm dlx shadcn add @01orbital/limb-scene-large-eclipse

New

limb-scene-left-horizon

limb-scene-left-horizon

Left Horizon

Limb Scene example with the disc moved to the left and the horizon raised, for a lopsided composition. Shows an off-center planet horizon space background.

pnpm dlx shadcn add @01orbital/limb-scene-left-horizon

New

limb-scene-high-horizon

limb-scene-high-horizon

High Horizon

Limb Scene example on a light ground with the horizon near the top and a small disc, leaving most of the frame as planet. Shows a high horizon planet background.

pnpm dlx shadcn add @01orbital/limb-scene-high-horizon

New

limb-scene-low-horizon

limb-scene-low-horizon

Low Horizon

Limb Scene example: a night sky with the horizon pushed low, giving the sky and eclipse most of the frame. Shows a low horizon planet background for space themed heroes.

pnpm dlx shadcn add @01orbital/limb-scene-low-horizon

New

limb-scene-soft-corona

limb-scene-soft-corona

Soft Corona

Limb Scene example with a small disc surrounded by a very wide, diffuse corona and a strong glow, for a soft, hazy light. Shows the soft corona option of the space background.

pnpm dlx shadcn add @01orbital/limb-scene-soft-corona

New

limb-scene-hard-rim

limb-scene-hard-rim

Hard Rim

Limb Scene example with a larger disc, no glow and a tight corona, giving a crisp, sharp-edged eclipse. Shows the hard rim option of the planet horizon space background.

pnpm dlx shadcn add @01orbital/limb-scene-hard-rim

New

limb-scene-narrow-planet

limb-scene-narrow-planet

Narrow Planet

Limb Scene example with a horizon that curves tightly, so the planet reads as a small world close to the viewer. Shows a narrow planet option of the space background.

pnpm dlx shadcn add @01orbital/limb-scene-narrow-planet

New

limb-scene-flat-distant-limb

limb-scene-flat-distant-limb

Flat Distant Limb

Limb Scene example with a very wide planet whose horizon looks almost flat, as if seen from far away. Shows a planet horizon space background with a gentle curve.

pnpm dlx shadcn add @01orbital/limb-scene-flat-distant-limb

New

limb-scene-clean-sky

limb-scene-clean-sky

Clean Sky

Limb Scene example on a light ground with the film grain removed, for a smooth, clean sky. Shows the planet horizon space background without texture.

pnpm dlx shadcn add @01orbital/limb-scene-clean-sky

New

limb-scene-observatory-invitation

limb-scene-observatory-invitation

Observatory Invitation

Invitation card example: an inset Limb Scene with an After sunset note inviting visitors to the observatory on Friday evenings. Shows the planet horizon space background behind event text.

pnpm dlx shadcn add @01orbital/limb-scene-observatory-invitation

New

limb-scene-poster-with-neon-title

limb-scene-poster-with-neon-title

Poster With Neon Title

Poster example: a night-side Limb Scene with a glowing NIGHT SCHOOL neon sign at the bottom left. Shows the planet horizon space background paired with neon signage text.

pnpm dlx shadcn add @01orbital/limb-scene-poster-with-neon-title

New

limb-scene-centered-chapter-title

limb-scene-centered-chapter-title

Centered Chapter Title

Chapter title card example: a Limb Scene with the eclipse disc centered high above the horizon and a title and subtitle at the bottom. Shows the planet horizon background behind text.

pnpm dlx shadcn add @01orbital/limb-scene-centered-chapter-title

New

limb-scene-gallery-caption-on-light

limb-scene-gallery-caption-on-light

Gallery Caption On Light

Gallery print example: a panel-framed Limb Scene with rounded corners and a caption below, set on a light page. Shows the planet horizon space background as framed artwork.

pnpm dlx shadcn add @01orbital/limb-scene-gallery-caption-on-light

New

limb-scene-wide-landscape

limb-scene-wide-landscape

Wide Landscape

Limb Scene example cropped into a wide, pill-shaped band, with a slightly larger disc over a broad horizon. Shows the planet horizon space background as a banner.

pnpm dlx shadcn add @01orbital/limb-scene-wide-landscape

New

limb-scene-portrait-study

limb-scene-portrait-study

Portrait Study

Limb Scene example: a tall, arch-topped scene on a light ground, with the disc centered and the horizon low. Shows the planet horizon space background cropped into a portrait print.

pnpm dlx shadcn add @01orbital/limb-scene-portrait-study

API reference

Prop

Type

Dependencies

npm: cn. The CLI installs them for you.

No other registry pieces.

Backlit Blocks Scene

bone-slabs

cobalt-slabs

Color Wash

copper-slabs

Gestural Zip Scene