Button

Installing

Install the component

npm install @supabase/ui

Getting started

Import the component

import { Button } from '@supabase/ui'

Basic

You can define the type of a button using the type prop. There are primary, default, secondary, outline, dashed, and text,

Button types

You can define the type of a button using the type prop.

There are primary, default, secondary, outline, dashed, and text.

Size

You can define the size of a button using the size prop.

There are tiny, small, medium, large and xlarge. The default size is tiny

Using icons

Icons can be used with a Button using the icon prop. You can import any Icon component from Supabase UI.

If you use Icons from the Supabase UI library, the Icon will respect the size of the Button. For example: if the Button is shown in Xlarge, then the Icon will be shown in XLarge.

There is also support for icons on the right side of the button using buttonRight.

With block

Buttons can be expanded to take the entire width of the space using the prop block.

API Reference