Skip to content

3D · 16 pieces to copy

3D that earns its place.

Phones on a turntable, a brochure that bends like paper, a ticket that tears, a gift that opens, a coin that turns over and spheres that become what you sell. Original code, lazy-loaded, with a still frame for reduced motion.

Meet the spheresSee the showcases

01Spheres

Spheres with a job.

A liquid drop that melts into a heart, a dumbbell or a pin; a cloud of points that pours into a ring or a galaxy; a wire globe you drive with a level; a planet with a day and a night side.

  • Morph Sphere

    A liquid sphere that melts into the things you sell: fifteen shapes, four skins, tap for the next.

  • Particle Sphere

    A cloud of points that is a sphere until it is a ring, a heart, a cube, a helix or a galaxy, and shies from the pointer.

  • Wire Globe

    A sphere drawn as light: glowing wire, bright nodes, a halo of points and a pulse you drive.

  • Planet

    A world: continents, ice, clouds that turn, city lights on the night side and a glowing atmosphere.

The morph sphere takes shape packs for a kind of business (studio, fitness, gifting, retail, wellness) and four skins: liquid, pearl, chrome and glass.

02Showcases

Premium pieces, ready to paste.

Each one is a component with its install command, an AI prompt and a real spec. Play with them here; they load only as you reach them.

01phones · carousel

Phone Ring

Phones on a turntable: drag to spin with inertia, tap an arrow, keyboard-friendly. Pure CSS 3D.

Props and code →
npx shadcn@latest add @vibebox/phone-ring

01 / 07Bakery · SampleWarm bread, ordered ahead

02brochure · book

Brochure

A 3D brochure whose paper bends: click a page, drag a corner or press the arrow keys to turn it.

Props and code →
npx shadcn@latest add @vibebox/brochure
  1. Casa Alon · 2026A weekend, written down.
  2. WelcomeSix rooms, one pool, no schedule.Casa Alon is a small house by the water in Batangas. There is a kitchen that opens when you do and a long table for everyone.
  3. 01 · StayThe roomsEach room faces the sea and has its own door to the garden. Beds are made with linen from a weaver two towns over.
  4. 02 · EatThe tableBreakfast is whatever the market had that morning. Dinner is one long table at eight, and there is always rice.
  5. 03 · DoThe daysSwim before breakfast, read after it, and take the boat out once the wind drops. Nobody will keep a list for you.
  6. 04 · Find usGetting hereTwo and a half hours from Manila by car. We will send the pin and a number to call when the road runs out.
  7. NotesGood to knowDates are held for 48 hours without a deposit. Bring a hat.
  8. Casa AlonSee you soon.

03ticket · 3d

Ticket

A 3D paper ticket with a foil spine that leans to the pointer and tears at the stub when you hold over it.

Props and code →
npx shadcn@latest add @vibebox/ticket

Hold the pointer over the stub

Tickets that feel like tickets.

04globe · map

Dotted Globe

A globe of dots with pulsing markers and arcs; drag to turn it, choose a place to spin to it.

Props and code →
npx shadcn@latest add @vibebox/dotted-globe

05product · box

Product Box

A packaging box in CSS 3D with your art on every face: drag it, or turn it a side at a time with the arrow keys.

Props and code →
npx shadcn@latest add @vibebox/product-box

Retail · Sample

Pick it up and turn it over.

Drag the box, or use the arrow keys to turn it a side at a time.

Hillside · SampleMorning Green Tea20 pyramid bags
How to brewWater at 80°C. One bag, two minutes. Take it out before it turns bitter.Sample copy for a demonstration.
Green tea
Hillside

06gift · box

Gift Box

A wrapped gift whose lid swings open on hover, with a warm light and a burst of confetti.

Props and code →
npx shadcn@latest add @vibebox/gift-box

Gifting · Sample

Something small, wrapped well.

Hold the pointer over the box and the lid lifts.

07envelope · invitation

Envelope

An envelope that opens on a press: the flap swings back, the card rises out and comes forward.

Props and code →
npx shadcn@latest add @vibebox/envelope
You are invitedAlon & ReyesSaturday, 12 December · Batangas

Press the envelope to open it.

08card · holographic

Holo Card

A holographic card: it leans to the pointer, a glare follows, and a band of spectrum foil slides with the angle.

Props and code →
npx shadcn@latest add @vibebox/holo-card

09mirror-ball · disco

Mirror Ball

A spinning mirror ball that throws flecks of coloured light across a dark room, faster when you hover.

Props and code →
npx shadcn@latest add @vibebox/mirror-ball

10coin · loyalty

Coin

A struck coin with a reeded edge, your mark and words on its face; hold the pointer on it and it turns over.

Props and code →
npx shadcn@latest add @vibebox/coin

Loyalty · Sample

Every tenth coffee is struck in gold.

Hold the pointer over the coin and it turns over.

11cards · fan

Card Fan

A hand of cards: lift one on hover, bring it forward on tap, arrow keys between them. Pure CSS 3D.

Props and code →
npx shadcn@latest add @vibebox/card-fan

More 3D

The rest of the 3D shelf.

The liquid orb for AI assistants, the puzzle cube, the infinity ribbon, the thinking orbs and the launch stack live with the other 3D centrepieces.

All 3D components3D backgroundsStart a project
All components
↑ ↓ to move↵ to openesc to close