hip-ui / apps / docs / src / examples / icon-button / sizes.tsx

import { Minus, Plus, Settings } from "lucide-react";

import { Flex } from "@/components/flex";
import { IconButton } from "@/components/icon-button";

export function IconButtonSizes() {
  return (
    <Flex gap="2xl" align="center">
      <IconButton label="Small" size="sm">
        <Plus />
      </IconButton>
      <IconButton label="Medium" size="md">
        <Minus />
      </IconButton>
      <IconButton label="Large" size="lg">
        <Settings />
      </IconButton>
    </Flex>
  );
}