Shadcn.io is not affiliated with official shadcn/ui
React Moon Phase Calendar Block
A React moon phase calendar block for Next.js with lunar phase icons, phase names, illumination percentage, and monthly cycle view built with shadcn/ui and Tailwind CSS
Track the lunar cycle with this React and Next.js moon phase calendar block. View phase icons, phase names, illumination percentages, and key lunar dates across the month. Built with TypeScript, shadcn/ui Badge and Button components, and Tailwind CSS. Ideal for astronomy dashboards, gardening planners, astrology apps, and outdoor photography scheduling.
React Moon Phase Calendar Block preview
Installation
Related Components
Weather Forecast
7-day weather forecast
Monthly View
Full month calendar grid
Campaign Timeline
Marketing campaign phases
Fiscal Quarters
Quarterly revenue overview
Exam Schedule
Academic exam tracker
Leave Tracker
PTO and leave management
FAQ
Was this page helpful?
Sign in to leave feedback.
React Monthly Calendar View Block
A full month calendar grid with event dot indicators, interactive day selection, and an event list sidebar built with React, Next.js, shadcn/ui, and Tailwind CSS
React On-Call Rotation Calendar Block
React on-call rotation calendar block for Next.js with escalation chain display, swap request management, coverage gaps, and weekly rotation schedule built with shadcn/ui and Tailwind CSS