Components
Loading preview...
This is a sleek and responsive mini calendar component built using React and TailwindCSS, designed to display weekly views with a focus on minimalism and clarity. The selected day is highlighted with a bold background and primary accent color (blue-600), while adjacent dates remain subtle for visual hierarchy. Navigation arrows allow users to switch between months smoothly. The component is ideal for dashboards, schedulers, or date-picking interfaces.
@hardik0110
npx shadcn@latest add https://21st.dev/r/hardik0110/mini-calendar"use client";
import * as React from "react";
import { Calendar } from "@/components/ui/mini-calendar";
const DemoMiniCalendar = () => {
return (
<div className="w-[350px]">
<Calendar />
</div>
);
};
export { DemoMiniCalendar };