Button
An interactive element used to trigger actions.
Usage
solid
soft
outline
ghost
link
import { Button, type ButtonProps } from '@tacos-ui/react';
import { ArrowRightIcon } from 'lucide-react';
export const Demo = (props: ButtonProps) => {
return (
<Button {...props}>
Button
<ArrowRightIcon />
</Button>
);
};
Examples
With a different color
Use the colorPalette prop to change the color of the button.
<Flex gap="3">
<Button colorPalette="red" variant="solid">
Button
</Button>
<Button colorPalette="red" variant="subtle">
Button
</Button>
<Button colorPalette="red" variant="outline">
Button
</Button>
<Button colorPalette="red" variant="ghost">
Button
</Button>
</Flex>