Trip Weather

Per-day weather strip for an upcoming trip with emoji glyphs, high/low, and an amber packing tip.

Lisbon · Jun 14 – 18

Fri 1427°18°

Sat 1526°19°

Sun 1623°18°

Mon 1721°17°

Tue 1824°18°

Pack a light jacket for Mon evening showers.

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

Import & use

import { Travel24 } from "@/components/beste/piece/travel24";

<Travel24
  city="Lisbon · Jun 14 – 18"
  days={[
    {
      "date": "Fri 14",
      "high": 27,
      "low": 18,
      "icon": "sun"
    },
    {
      "date": "Sat 15",
      "high": 26,
      "low": 19,
      "icon": "partly"
    },
    {
      "date": "Sun 16",
      "high": 23,
      "low": 18,
      "icon": "cloud"
    },
    {
      "date": "Mon 17",
      "high": 21,
      "low": 17,
      "icon": "rain"
    },
    {
      "date": "Tue 18",
      "high": 24,
      "low": 18,
      "icon": "partly"
    }
  ]}
  advisory="Pack a light jacket for Mon evening showers."
/>