# 21st.dev Category Map

Use this file when mapping a reference site's sections to 21st.dev buckets or when generating a manual collection checklist.

## Landing Page Sections

| Section | Primary categories | Secondary categories |
|---|---|---|
| Announcement bar | `announcement` | `badge`, `text`, `link` |
| Header / Navbar | `navbar-navigation` | `announcement`, `button`, `dropdown`, `menu` |
| Hero | `hero` | `call-to-action`, `background`, `text`, `image` |
| Feature grid | `features` | `card`, `icons`, `number` |
| Social proof / logos | `image` | `icons`, `scroll-area` |
| Testimonials | `testimonials` | `card`, `carousel` |
| Pricing | `pricing-section` | `comparison`, `card`, `button` |
| FAQ | `accordion` | `text` |
| Footer | `footer` | `link`, `button` |

## App / Dashboard Sections

| Section | Primary categories | Secondary categories |
|---|---|---|
| Sidebar | `sidebar` | `menu`, `navbar-navigation`, `scroll-area` |
| Data table | `table` | `pagination`, `tabs`, `card` |
| Filters / forms | `form` | `input`, `select`, `radio-group`, `checkbox`, `button` |
| Dialogs | `modal-dialog` | `popover`, `button`, `toast` |
| Auth | `sign-in`, `registration-signup` | `form`, `input`, `button` |
| Chat | `ai-chat` | `input`, `button`, `avatar` |

## Raw Category Index

| Slug | Label | Count | URL |
|---|---|---:|---|
| `announcement` | Announcements | 10 | `https://21st.dev/s/announcement` |
| `background` | Backgrounds | 33 | `https://21st.dev/s/background` |
| `border` | Borders | 12 | `https://21st.dev/s/border` |
| `call-to-action` | Calls to Action | 34 | `https://21st.dev/s/call-to-action` |
| `comparison` | Comparisons | 6 | `https://21st.dev/s/comparison` |
| `dock` | Docks | 6 | `https://21st.dev/s/dock` |
| `features` | Features | 36 | `https://21st.dev/s/features` |
| `footer` | Footers | 14 | `https://21st.dev/s/footer` |
| `hero` | Heroes | 73 | `https://21st.dev/s/hero` |
| `hook` | Hooks | 31 | `https://21st.dev/s/hook` |
| `image` | Images | 26 | `https://21st.dev/s/image` |
| `map` | Maps | 2 | `https://21st.dev/s/map` |
| `navbar-navigation` | Navigation Menus | 11 | `https://21st.dev/s/navbar-navigation` |
| `pricing-section` | Pricing Sections | 17 | `https://21st.dev/s/pricing-section` |
| `scroll-area` | Scroll Areas | 24 | `https://21st.dev/s/scroll-area` |
| `shader` | Shaders | 15 | `https://21st.dev/s/shader` |
| `testimonials` | Testimonials | 15 | `https://21st.dev/s/testimonials` |
| `text` | Texts | 58 | `https://21st.dev/s/text` |
| `video` | Videos | 9 | `https://21st.dev/s/video` |
| `accordion` | Accordions | 40 | `https://21st.dev/s/accordion` |
| `ai-chat` | AI Chats | 30 | `https://21st.dev/s/ai-chat` |
| `alert` | Alerts | 23 | `https://21st.dev/s/alert` |
| `avatar` | Avatars | 17 | `https://21st.dev/s/avatar` |
| `badge` | Badges | 25 | `https://21st.dev/s/badge` |
| `button` | Buttons | 130 | `https://21st.dev/s/button` |
| `calendar` | Calendars | 34 | `https://21st.dev/s/calendar` |
| `card` | Cards | 79 | `https://21st.dev/s/card` |
| `carousel` | Carousels | 16 | `https://21st.dev/s/carousel` |
| `checkbox` | Checkboxes | 19 | `https://21st.dev/s/checkbox` |
| `date-picker` | Date Pickers | 12 | `https://21st.dev/s/date-picker` |
| `modal-dialog` | Dialogs / Modals | 37 | `https://21st.dev/s/modal-dialog` |
| `dropdown` | Dropdowns | 25 | `https://21st.dev/s/dropdown` |
| `empty-state` | Empty States | 1 | `https://21st.dev/s/empty-state` |
| `file-tree` | File Trees | 2 | `https://21st.dev/s/file-tree` |
| `upload-download` | File Uploads | 7 | `https://21st.dev/s/upload-download` |
| `form` | Forms | 23 | `https://21st.dev/s/form` |
| `icons` | Icons | 10 | `https://21st.dev/s/icons` |
| `input` | Inputs | 102 | `https://21st.dev/s/input` |
| `link` | Links | 13 | `https://21st.dev/s/link` |
| `menu` | Menus | 18 | `https://21st.dev/s/menu` |
| `notification` | Notifications | 5 | `https://21st.dev/s/notification` |
| `number` | Numbers | 18 | `https://21st.dev/s/number` |
| `pagination` | Paginations | 20 | `https://21st.dev/s/pagination` |
| `popover` | Popovers | 23 | `https://21st.dev/s/popover` |
| `radio-group` | Radio Groups | 22 | `https://21st.dev/s/radio-group` |
| `select` | Selects | 62 | `https://21st.dev/s/select` |
| `sidebar` | Sidebars | 10 | `https://21st.dev/s/sidebar` |
| `sign-in` | Sign Ins | 4 | `https://21st.dev/s/sign-in` |
| `registration-signup` | Sign ups | 4 | `https://21st.dev/s/registration-signup` |
| `slider` | Sliders | 45 | `https://21st.dev/s/slider` |
| `spinner-loader` | Spinner Loaders | 21 | `https://21st.dev/s/spinner-loader` |
| `table` | Tables | 30 | `https://21st.dev/s/table` |
| `tabs` | Tabs | 38 | `https://21st.dev/s/tabs` |
| `chip-tag` | Tags | 6 | `https://21st.dev/s/chip-tag` |
| `textarea` | Text Areas | 22 | `https://21st.dev/s/textarea` |
| `toast` | Toasts | 2 | `https://21st.dev/s/toast` |
| `toggle` | Toggles | 12 | `https://21st.dev/s/toggle` |
| `tooltip` | Tooltips | 28 | `https://21st.dev/s/tooltip` |
