Shadcn.io is not affiliated with official shadcn/ui
Calendar Weather Forecast
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.
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.
Water Intake
A water intake tracking calendar block for Next.js with daily hydration goals, glass counting, weekly trends, and reminder scheduling using shadcn/ui and Tailwind CSS
Weekly Planner
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