Shadcn.io is not affiliated with official shadcn/ui
React Weather Forecast Calendar Block
A React 7-day weather forecast calendar block for Next.js with temperature, conditions, wind speed, and daily weather icons built with shadcn/ui and Tailwind CSS
Display a 7-day weather forecast in a calendar card layout with this React and Next.js block. Each day shows high and low temperatures, weather conditions, wind speed, and humidity percentage. Built with TypeScript, shadcn/ui Badge and Button components, and Tailwind CSS. Perfect for travel planning dashboards, event scheduling tools, and outdoor activity planners.
React Weather Forecast Calendar Block preview
Installation
Related Components
Monthly View
Full month calendar grid
Moon Phases
Lunar cycle calendar
Campaign Timeline
Marketing campaign phases
Leave Tracker
PTO and leave management
Exam Schedule
Academic exam tracker
Fiscal Quarters
Quarterly revenue overview
FAQ
Was this page helpful?
Sign in to leave feedback.
React Travel Itinerary Calendar Block
React travel itinerary timeline block for Next.js with flights, hotels, activities per day, map markers, and trip progress tracking built with shadcn/ui and Tailwind CSS
React Weekly Calendar Planner Block
A weekly planner calendar with hourly time slots, event blocks spanning time ranges, and navigable day headers built with React, Next.js, shadcn/ui, and Tailwind CSS