Checkboxes

  • 1

    As mentioned in the Setup tab, some of our components follow Shadcn UI, with differences done on top of these components, namely a wider range of variants and functionality, all the while keeping the deep customization options open. You can get started by installing the component from

  • 2

    To have access to our features copy the code in the block below and replace the existing code in the generated component file in your project, which by default is components/ui/checkbox.tsx

  • 3

    Make sure to adjust any necessary imports and styles to fit your setup, preference and needs.

Examples

Combos

  • Checkbox Tree

    Product Categories

  • Checkbox Form

    Receive emails about new products, features, and more.

    Select the items you want to display in the sidebar.

    You agree to our Terms of Service and Privacy Policy.

  • Checkbox Group

    Filter by category
  • Checkbox Table

    NameEmailRole
    John Doejohn@example.comAdmin
    Jane Smithjane@example.comUser
    Bob Johnsonbob@example.comEditor
    Alice Brownalice@example.comUser
    Charlie Wilsoncharlie@example.comViewer