Program Curve Pricing
Pricing beside the product's sunrise programs: pick gentle, standard or brisk and its curve morphs on a spring while the lamp, rendered live in a dark room, plays that sunrise in six seconds, next to the plans.
This is a viberdy Pro component
The live preview, the props panel and the write-up are open to everyone. The full source, the AI prompt and CLI install are part of Pro.
Pricing
One lamp. Every morning, your way.
The sunrise most people keep.
- The lamp and its base
- Every sunrise program
- The app, no subscription
- Two lamps, set separately
- Every sunrise program
- Shared or separate alarms
Props
"use client";
import { useEffect, useRef, useState, useSyncExternalStore } from "react";
import type { CSSProperties, KeyboardEvent as ReactKeyboardEvent, ReactNode, RefObject } from "react";
/**
* ProgramCurvePricing — pricing beside the sunrise programs, with the lamp playing whichever you pick.
*
* Choose a program and its curve morphs on a spring while the lamp, rendered
* live in a dark room, plays that sunrise in six seconds, from an ember to
* the program's own daylight colour, then holds. The programs are a radio
* group with arrow keys; the plans sit beside them.
*
* Part of the Modern Minimal kit: a paper-white room (#f5f5f2, surfaces
* #ffffff, ink #141412) and one light, dawn #ffa64d, only ever as light.
* Two-layer shadows from one light above; scroll binds values directly,
* with no easing. Inter Tight through var(--font-inter-tight) for display
* over Geist. Respects prefers-reduced-motion. No dependencies beyond React.
// ---------------------------------------------------------------
// Full source available with a viberdy Pro subscription.
// https://viberdy.dev/pricing
// ---------------------------------------------------------------
}About this section
Pricing for a device whose value is how it behaves, so the behaviour is shown. The sunrise programs are a radio group: pick one and its curve morphs on a spring into the new shape, and the lamp, rendered live in a dark room, plays that sunrise in six seconds, from an ember to the program's own daylight colour, then holds. A chip names the program and its length; a line says who it suits. Beside it, the plans with their prices and what each includes, the first one raised on the kit's two-layer shadow, each with the kit's pill button.
Curator’s note
The Modern Minimal kit's pricing (slot 8), cut from modern-minimal-site. Pro: the kit's WebGL2 room playing a chosen program, a spring-morphed SVG curve and the plans.
Pairs well with
Matched on shared tags and category — the entries most likely to be used alongside this one.
Finish Tier Pricing
sectionsPricing where each tier is a material shown on the product itself: the dial stands on a mirror floor in the chosen finish, changes material when you pick another tier, hops and clicks its ring round.
Dawn Timeline Section
sectionsThe sunrise laid out on a timeline and scrubbed by the scroll: the section pins, 05:30 to 07:00 runs with the scroll, the lamp rendered live rises along its curve, and the time, colour, output and phase follow.
Ember Rest Footer
sectionsA footer where the day ends: as it rises into view the room above the links, rendered live, loses its daylight, the lamp dims to an ember, and the whole footer goes from paper to night under a closing line.