Checkbox

Forms 85

About

A control that allows the user to toggle between checked and not checked.

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

Code

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

Usage.tsx

import { useId, useState } from 'react';
import { Checkbox } from '@/components/ui/checkbox';

const DemoOne = () => {
  const [checked, setChecked] = useState<boolean>(true);

  return (
    <div className="flex items-center space-x-2 justify-center h-screen w-full">
      <Checkbox checked={checked}
        onCheckedChange={(value) => setChecked(!!value)}/>
    </div>
  );
};

export { DemoOne };