# Cnippet

> Premium UI components, pre-built blocks, and guides to accelerate React and Next.js development.

- Owner: [Cnippet](https://21st.dev/@cnippet-dev)
- Components: 334
- Website: https://blocks.cnippet.dev
- GitHub: https://github.com/cnippet-dev
- Live page: https://21st.dev/@cnippet-dev/library/cnippet

## Components

Showing the first 100 of 334 — browse the rest at https://21st.dev/@cnippet-dev/library/cnippet.

- [Accordion](https://21st.dev/@cnippet-dev/components/accordion.md)
- [Accordion with Plus/Minus Indicators](https://21st.dev/@cnippet-dev/components/v-accordion-5.md)
- [Account Deactivation Alert Dialog](https://21st.dev/@cnippet-dev/components/v-alert-dialog-5.md)
- [Account Menu](https://21st.dev/@cnippet-dev/components/v-menu-11.md)
- [Account Settings Fieldset](https://21st.dev/@cnippet-dev/components/v-fieldset-7.md)
- [Activity Log Drawer](https://21st.dev/@cnippet-dev/components/activity-log-drawer.md)
- [Activity Log Sheet](https://21st.dev/@cnippet-dev/components/v-sheet-8.md)
- [Aero Blog-1](https://21st.dev/@cnippet-dev/components/aero-blog-1.md)
- [Aero Footer-1](https://21st.dev/@cnippet-dev/components/aero-footer-1.md)
- [Aero Hero-1](https://21st.dev/@cnippet-dev/components/aero-hero-1.md)
- [Aero Hero-3](https://21st.dev/@cnippet-dev/components/aero-hero-3.md)
- [Aero Metrics-1](https://21st.dev/@cnippet-dev/components/aero-metrics-1.md)
- [AI Response Text Generate Card](https://21st.dev/@cnippet-dev/components/m-text-generate-effect-2.md)
- [Alert](https://21st.dev/@cnippet-dev/components/alert.md)
- [Alert with Icon and Actions](https://21st.dev/@cnippet-dev/components/v-alert-3.md)
- [Announcement Banner](https://21st.dev/@cnippet-dev/components/announcement-banner.md)
- [API Usage Meter Card](https://21st.dev/@cnippet-dev/components/v-meter-8.md)
- [Appointment Booking Calendar](https://21st.dev/@cnippet-dev/components/v-calendar-8.md)
- [Appointment Booking Date Picker](https://21st.dev/@cnippet-dev/components/appointment-booking-date-picker.md)
- [Auth Form with Spinner](https://21st.dev/@cnippet-dev/components/v-spinner-14.md)
- [Autocomplete Field](https://21st.dev/@cnippet-dev/components/v-field-7.md)
- [Avatar](https://21st.dev/@cnippet-dev/components/avatar.md)
- [Avatar Stack](https://21st.dev/@cnippet-dev/components/avatar-stack.md)
- [Badge](https://21st.dev/@cnippet-dev/components/badge.md)
- [Basic Context Menu](https://21st.dev/@cnippet-dev/components/v-context-menu-2.md)
- [Basic Select](https://21st.dev/@cnippet-dev/components/v-select-2.md)
- [Billing Details Fieldset](https://21st.dev/@cnippet-dev/components/v-fieldset-1.md)
- [Billing Frequency Radio Group](https://21st.dev/@cnippet-dev/components/billing-frequency-radio-group.md)
- [Billing Warning Alert Dialog](https://21st.dev/@cnippet-dev/components/billing-warning-alert-dialog.md)
- [Birthday Date Picker](https://21st.dev/@cnippet-dev/components/v-date-picker-14.md)
- [Blogs](https://21st.dev/@cnippet-dev/components/blogs.md)
- [Booking Calendar](https://21st.dev/@cnippet-dev/components/v-calendar-15.md)
- [Bookmark Toggle List](https://21st.dev/@cnippet-dev/components/v-toggle-11.md)
- [Bordered Rounded Accordion](https://21st.dev/@cnippet-dev/components/v-accordion-6.md)
- [Boxly Pricing-1](https://21st.dev/@cnippet-dev/components/boxly-pricing-1.md)
- [Breadcrumb](https://21st.dev/@cnippet-dev/components/breadcrumb.md)
- [Breadcrumb with Avatar](https://21st.dev/@cnippet-dev/components/v-breadcrumb-6.md)
- [Breadcrumb with Icons](https://21st.dev/@cnippet-dev/components/v-breadcrumb-5.md)
- [Breadcrumb with Project, User & Document Info](https://21st.dev/@cnippet-dev/components/v-breadcrumb-10.md)
- [Button](https://21st.dev/@cnippet-dev/components/button.md)
- [Button Breadcrumb](https://21st.dev/@cnippet-dev/components/v-breadcrumb-9.md)
- [Calendar with Custom Select Dropdown](https://21st.dev/@cnippet-dev/components/v-calendar-5.md)
- [Calendar with Dropdown Navigation](https://21st.dev/@cnippet-dev/components/v-calendar-4.md)
- [Calendar with Event Indicators](https://21st.dev/@cnippet-dev/components/v-calendar-10.md)
- [Calendar with Holidays](https://21st.dev/@cnippet-dev/components/v-calendar-14.md)
- [Canvas Zoom Toolbar](https://21st.dev/@cnippet-dev/components/v-toolbar-8.md)
- [Card Frame Table](https://21st.dev/@cnippet-dev/components/v-table-3.md)
- [Card Style Checkbox](https://21st.dev/@cnippet-dev/components/v-checkbox-4.md)
- [Card Table](https://21st.dev/@cnippet-dev/components/v-table-2.md)
- [Card with Border](https://21st.dev/@cnippet-dev/components/v-card-2.md)
- [Card with Border Separation](https://21st.dev/@cnippet-dev/components/v-card-3.md)
- [Card with Dropdown Menu](https://21st.dev/@cnippet-dev/components/v-card-5.md)
- [Card with Image](https://21st.dev/@cnippet-dev/components/v-card-6.md)
- [Card with Link](https://21st.dev/@cnippet-dev/components/v-card-4.md)
- [Changelog Accordion](https://21st.dev/@cnippet-dev/components/v-accordion-10.md)
- [Change Password Fieldset](https://21st.dev/@cnippet-dev/components/v-fieldset-5.md)
- [Change Password Form](https://21st.dev/@cnippet-dev/components/v-form-6.md)
- [Chat Thread Skeleton](https://21st.dev/@cnippet-dev/components/v-skeleton-9.md)
- [Checkbox](https://21st.dev/@cnippet-dev/components/checkbox.md)
- [Checkbox Group](https://21st.dev/@cnippet-dev/components/v-checkbox-group-6.md)
- [Checkbox Group Field](https://21st.dev/@cnippet-dev/components/v-field-13.md)
- [Checkbox Group Form](https://21st.dev/@cnippet-dev/components/v-checkbox-group-5.md)
- [Checkbox with Description](https://21st.dev/@cnippet-dev/components/v-checkbox-3.md)
- [Checkbox with Label](https://21st.dev/@cnippet-dev/components/v-checkbox-1.md)
- [Checkout Steps Breadcrumb](https://21st.dev/@cnippet-dev/components/v-breadcrumb-12.md)
- [CI/CD Build Log Viewer](https://21st.dev/@cnippet-dev/components/v-collapsible-9.md)
- [Code File Viewer Tabs](https://21st.dev/@cnippet-dev/components/v-tabs-14.md)
- [Collapsible Animated Card](https://21st.dev/@cnippet-dev/components/v-collapsible-3.md)
- [Collapsible Billing Card](https://21st.dev/@cnippet-dev/components/v-collapsible-4.md)
- [Collapsible Filter Panel](https://21st.dev/@cnippet-dev/components/v-collapsible-12.md)
- [Collapsible Form Fields](https://21st.dev/@cnippet-dev/components/v-collapsible-5.md)
- [Contact Form](https://21st.dev/@cnippet-dev/components/v-form-5.md)
- [Context Menu](https://21st.dev/@cnippet-dev/components/context-menu.md)
- [Context Menu Social Feed](https://21st.dev/@cnippet-dev/components/v-context-menu-14.md)
- [Context Menu with Checkboxes](https://21st.dev/@cnippet-dev/components/context-menu-checkboxes.md)
- [Context Menu with Icons](https://21st.dev/@cnippet-dev/components/context-menu-icons.md)
- [Context Menu with Radio Groups](https://21st.dev/@cnippet-dev/components/v-context-menu-7.md)
- [Context Menu with Shortcuts](https://21st.dev/@cnippet-dev/components/v-context-menu-3.md)
- [Controlled Accordion](https://21st.dev/@cnippet-dev/components/v-accordion-4.md)
- [Cookie Consent Banner](https://21st.dev/@cnippet-dev/components/v-alert-12.md)
- [Cookie Preferences Manager](https://21st.dev/@cnippet-dev/components/v-switch-9.md)
- [Copy to Clipboard Tooltip](https://21st.dev/@cnippet-dev/components/v-tooltip-11.md)
- [Counting Number](https://21st.dev/@cnippet-dev/components/counting-number.md)
- [Country Combobox](https://21st.dev/@cnippet-dev/components/v-combobox-10.md)
- [Create Project Card](https://21st.dev/@cnippet-dev/components/v-card-1.md)
- [Currency Select](https://21st.dev/@cnippet-dev/components/v-select-6.md)
- [Custom Separator Breadcrumb](https://21st.dev/@cnippet-dev/components/v-breadcrumb-2.md)
- [Dashboard Metrics Tabs](https://21st.dev/@cnippet-dev/components/dashboard-metrics-tabs.md)
- [Dashboard Stats Skeleton](https://21st.dev/@cnippet-dev/components/v-skeleton-4.md)
- [Data Export Checkbox Group](https://21st.dev/@cnippet-dev/components/v-checkbox-group-14.md)
- [Data Table Skeleton](https://21st.dev/@cnippet-dev/components/v-skeleton-7.md)
- [Date of Birth Calendar](https://21st.dev/@cnippet-dev/components/v-calendar-12.md)
- [Date of Birth Field](https://21st.dev/@cnippet-dev/components/v-field-19.md)
- [Date Picker with Dropdown Navigation](https://21st.dev/@cnippet-dev/components/v-date-picker-3.md)
- [Date Picker with Presets](https://21st.dev/@cnippet-dev/components/date-picker-with-presets.md)
- [Date Range Calendar](https://21st.dev/@cnippet-dev/components/v-calendar-3.md)
- [Date Range Picker](https://21st.dev/@cnippet-dev/components/v-date-picker-2.md)
- [Date Range Picker with Presets](https://21st.dev/@cnippet-dev/components/v-date-picker-11.md)
- [Davincho Hero-1](https://21st.dev/@cnippet-dev/components/davincho-hero-1.md)
- [Delete Account Form](https://21st.dev/@cnippet-dev/components/v-form-12.md)

Full component directory: https://21st.dev/llms.txt