Format Toolbar

About this piece

Compact formatting bar with bold, italic, underline, strike, align, and link buttons.

Usage

The import and the props worth knowing about, in one place.

import { Toolbar1 } from "@/components/beste/piece/toolbar1";

<Toolbar1
  surface="card"
  bordered={true}
  inverted={false}
/>

Canvas toolbar with select, move, hand, zoom, and crop. Active tool fills muted.

Row of icon buttons for like, comment, share, and save. Active items tint rose.

Vertical toolbar with pen, brush, eraser, text, and shapes. Active tool inverts to foreground.

125%

Segmented zoom control with minus, a monospace percentage readout, and plus.

A floating pill toolbar of round icon actions with one accent-highlighted primary action.

Left / center / right / justify alignment buttons. Active state fills muted.