Zephra
A weather dashboard with a live rain radar, in night blue
A complete weather dashboard app in a dark slate and sky-blue look with an amber sun, with a night and a day theme, and it comes with sample data for places in Portugal and around the world. Good for: a weather site or app, a travel or outdoor product that needs a forecast screen, or a starting point for any data dashboard with maps and charts. How it works: one rain map drives everything, so the radar you scrub or play from three hours ago to six hours ahead and every place's forecast always agree; switch Celsius and Fahrenheit and every figure updates at once. Includes: a today screen with the weather now, wind, UV, sunrise and sunset, humidity, visibility and feels-like, the week ahead and a rain map; a radar with rain, temperature, wind and cloud layers and a play button; the forecast hour by hour with a chart that switches between temperature, rain, wind and humidity, the next ten days and rain on its own; saved places with their own local time, reordering and a side-by-side compare; air quality and pollen; an activity planner that scores every hour of the week for a run, a picnic, the beach or golden hour and saves the plan; weather warnings on a timeline and your own alert rules; climate against the normal and records; settings with units, notifications, appearance and a reset; and help with a support form. How to use: run it as it is to explore with the sample data, which is saved in your browser, then connect your own weather API in place of the built-in sample forecast, since there is no backend; the sidebar opens to show labels, Cmd+K searches everything, and it works on every screen from phone to desktop with a bottom tab bar on phones. Built with React, TypeScript and GSAP.
$91.00 — one-time price, free updates
- A React app template
- React and Vite · npm install and it runs
- Build unlimited client sites with it
Built with React, CSS, GSAP.
What is in the zip
- app.css
- css/air.css
- css/alerts.css
- css/climate.css
- css/forecast.css
- css/help.css
- css/places.css
- css/planner.css
- css/radar.css
- css/settings.css
- css/today.css
- index.html
- src/App.tsx
- src/actions.tsx
- src/env.d.ts
- src/finder.tsx
- src/main.tsx
- src/motion.ts
- src/pages/air.tsx
- src/pages/alerts.tsx
- src/pages/climate.tsx
- src/pages/forecast.tsx
- src/pages/help.tsx
- src/pages/places.tsx
- src/pages/planner.tsx
- src/pages/radar.tsx
- src/pages/settings.tsx
- src/pages/today.tsx
- src/pages/types.ts
- src/radar.tsx
- src/router.ts
- src/store.ts
- src/ui/charts.tsx
- src/ui/format.ts
- src/ui/icons.tsx
- src/ui/kit.tsx
- src/ui/overlay.tsx
- src/ui/widgets.tsx
- src/ui/wxicon.tsx
- src/wx.ts
Version history
- v1.0.0, 2026-11-08 — First release. Zephra shipped, with the reel recorded from the real page.