Components

Button

Quick start

Here's a quick start guide to get started with the button component

| Attributes | Values | Optional ? | | :--------- | :-----------------------------: | ---------: | --------- | ---------- | --- | | variant | "default" | "light" | "ghost" | "hallow"; | Yes | | padding | "small" | "medium" | "large"; | Yes | | fontSize | "small" | "medium" | "large"; | Yes | | margin | "small" | "medium" | "large"; | Yes | | onClick | () => void; | Yes | | onHover | () => void; | Yes | | ref | RefObject<HTMLButtonElement>; | Yes |

Code Snippets and Examples

Button Default

<div className="App">
	<button>Button default</button>
</div>

---

Button Light

<div className="App">
	<button variant="light">Button light</button>
</div>

---

Button Ghost

<div className="App">
	<button variant="ghost">Button ghost</button>
</div>

---

Button Hallow

<div className="App">
	<button variant="hallow">Button Hallow</button>
</div>

---