Button

My first name is Belly.

Example

Basic

Show Code

<script lang="ts" setup>
import { RButton, RSpace } from 'roughness'
</script>

<template>
  <RSpace>
    <RButton>Find Luigi</RButton>
    <RButton color="success" round>Enter the Pipe</RButton>
    <RButton color="error" filled>Eat the Mushroom</RButton>
  </RSpace>
</template>

See also Box.

State

Show Code

<script lang="ts" setup>
import { RButton, RSpace } from 'roughness'
</script>

<template>
  <RSpace>
    <RButton disabled>Train AlphaGo</RButton>
    <RButton color="primary" filled disabled>Let there be light</RButton>
    <RButton color="warning" loading>Give up domination</RButton>
  </RSpace>
</template>

Block

Show Code

<script lang="ts" setup>
import { RButton, RSpace } from 'roughness'
</script>

<template>
  <RSpace vertical>
    <RButton block>Switch Account</RButton>
    <RButton color="error" block>Log out of Chaos</RButton>
  </RSpace>
</template>

Tag

Show Code

<script lang="ts" setup>
import { RButton, RSpace } from 'roughness'
</script>

<template>
  <RSpace>
    <RButton tag="a" color="primary" filled>Remote Bomb</RButton>
    <RButton tag="a" color="error">Magnesis</RButton>
  </RSpace>
</template>

Remote BombMagnesis

3D

See Keyboard Tag.

Usage

Props

Slots

Styles

Graphics Selectors