jshguo

Interfaces Checkbox

Forms 35

About

Checkbox component with checked, disabled, and combined states.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Interfaces Checkbox to your project and fits it to your theme.

Code

How Interfaces Checkbox is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { Checkbox } from "@/components/ui/component"
import { Label } from "@/components/ui/label"

export default function CheckboxDemo() {
  return (
    <div className="flex items-center justify-center w-full min-h-screen bg-background p-8 overflow-hidden">
      <div className="flex items-center gap-2">
        <Checkbox id="terms" />
        <Label htmlFor="terms">Accept terms and conditions</Label>
      </div>
    </div>
  )
}

Dependencies

More by jshguo

View all
  • Progress

    Progress

    427
  • Select

    Select

    372
  • Textarea

    Textarea

    260
  • Input OTP

    Input OTP

    161
  • Interfaces Carousel

    Interfaces Carousel

    161
  • Switch

    Switch

    138
  • Hover Card

    Hover Card

    110
  • Card

    Card

    85

More in Forms

View all
  • Premium Auth

    Premium Auth

    525
  • Contact Card

    Contact Card

    1K
  • Login 2

    Login 2

    8
  • Card Studio

    Card Studio

    41
  • Form

    Form

    16
  • Book A Demo 1

    Book A Demo 1

    74
  • HeroUI Field Error

    HeroUI Field Error

    10
  • Book A Demo 3

    Book A Demo 3

    90