Outlined Buttons

import { Button } from "flowbite-svelte";

Size xs

<Button name="Button text-xs" textSize="text-xs" btnColor="blue-outline" />
<Button name="Button text-xs" textSize="text-xs" btnColor="dark-outline" />
<Button name="Button text-xs" textSize="text-xs" btnColor="green-outline" />
<Button name="Button text-xs" textSize="text-xs" btnColor="red-outline" />
<Button name="Button text-xs" textSize="text-xs" btnColor="red-outline" />
<Button name="Button text-xs" textSize="text-xs" btnColor="purple-outline" />

Size sm

<Button name="Button" btnColor="blue-outline" />
<Button name="Button" btnColor="dark-outline" />
<Button name="Button" btnColor="green-outline" />
<Button name="Button" btnColor="red-outline" />
<Button name="Button" btnColor="red-outline" />
<Button name="Button" btnColor="purple-outline" />

Size base

<Button name="Button" textSize="text-base" btnColor="blue-outline" />
<Button name="Button" textSize="text-base" btnColor="dark-outline" />
<Button name="Button" textSize="text-base" btnColor="green-outline" />
<Button name="Button" textSize="text-base" btnColor="red-outline" />
<Button name="Button" textSize="text-base" btnColor="red-outline" />
<Button name="Button" textSize="text-base" btnColor="purple-outline" />

Props

The component has the following props, type, and default values. See types page for type information.

Related components

References