Tile UI Vue
Source code

Components

Toggle

A toggle button with pressed state.

Use Toggle to express a binary on/off selection as a button.

import { Toggle } from '@tile-ui/vue';
 
export default function ToggleDemo() {
	return (
		<div class="button-group">
			<Toggle>Bold</Toggle>

Registry install

pnpm dlx shadcn@latest add @tile-ui/toggle

Package usage

import { Toggle } from '@tile-ui/vue';
 
<Toggle variant="outline">Bold</Toggle>

Highlights

  • Three variants
  • Three sizes
  • Pressed state

Registry dependencies

Item Purpose
toggle Component source and module styles
core Framework-agnostic logic helpers
styles Shared SCSS tokens and globals

API reference

Toggle

Prop Type Default
variant 'default' | 'outline' | 'ghost' —
size 'sm' | 'default' | 'lg' —
PreviousTextareaNextToggleGroup