Reshaped Toggle button

Button that maintains a pressed/selected state, built on top of Button and defaulting to the outline variant. Inherits Button props (color, size, icons), supports a distinct selectedColor for the active state, controlled and uncontrolled modes via checked/defaultChecked, and a disabled flag.

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

import { Reshaped } from "reshaped/bundle";
import ToggleButton from "@/components/ui/reshaped-toggle-button";

export default function Demo() {
  return (
    <Reshaped theme="slate">
      <div style={{ margin: "0 auto", padding: 24, display: "flex", justifyContent: "center" }}>
        <ToggleButton defaultChecked>Toggle</ToggleButton>
      </div>
    </Reshaped>
  );
}