Driving Directions

Step-by-step driving panel with emerald start, sky turn, and rose end markers linked by a vertical rail.

Drive · 42 min58 km · Tolls €3.20
Start · Hotel Alma Soho0 km
Merge onto A1 North4 km
Exit 24 · Alcochete36 km
Arrive · Casa da Vinha58 km

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Travel30 } from "@/components/beste/piece/travel30";

<Travel30
  heading="Drive · 42 min"
  total="58 km · Tolls €3.20"
  steps={[
    {
      "label": "Start · Hotel Alma Soho",
      "distance": "0 km",
      "type": "start"
    },
    {
      "label": "Merge onto A1 North",
      "distance": "4 km",
      "type": "turn"
    },
    {
      "label": "Exit 24 · Alcochete",
      "distance": "36 km",
      "type": "turn"
    },
    {
      "label": "Arrive · Casa da Vinha",
      "distance": "58 km",
      "type": "end"
    }
  ]}
/>

More Travel pieces

View all Travel
ISTIstanbul
HNDTokyo
11h 05m · Nonstop

Route Arc

travel5

Visual route card with origin and destination framing an SVG dashed great-circle arc in a selectable tone.

Kyoto
Culture
KyotoJapan
Trending this month64.1K saves

Destination Card

travel12

Poster-style destination tile with a warm gradient, corner save heart, category tag, and city label.

ISTDepart
DOH2h
BKK4 days
SIN3 days
TYOReturn
11-day multi-city itinerary

Multi-City Route

travel23

Minimal multi-stop route with airport codes joined by thin connectors and a caption beneath each hop.

09:40IST
12:20CDG
3h 40m
2h 30m layover in Paris
14:50CDG
17:05LHR
1h 15m

Trip Segments

travel6

Multi-leg journey card with stacked segment rows and an amber layover strip between them.

Day 3Lisbon
Sat, Jun 14
09:00Time Out MarketCais do Sodré
12:30Ride Tram 28Praça Luís Camões
18:00Miradouro sunsetGraça

Itinerary Day

travel3

Day-of-trip card with a destination header and a vertical timeline of timed stops linked by a rail.

Row 1212D · Window
A
B
C
D
E
F
OpenYoursTaken

Seat Map Row

travel14

Airline seat-map row with an aisle gap, selected emerald seat, and a compact legend at the bottom.