Button Icon Sizes 1 - Outline icon button sizes

Pro

Outline icon buttons at extra-small, small, default, and large icon sizes.

Shadcn Button Icon Sizes 1 component

Component Data

  • ID:button/button-icon-sizes-1
  • Access:pro
  • Created:May 23, 2026
  • Type:example

Button Icon Sizes 1 component design & features

This example compares all four shadcn Button icon sizes side by side using the outline variant and icon-xs, icon-sm, icon, and icon-lg.

Use smaller icon sizes in dense tables and toolbars, and larger sizes when the tap target needs more prominence on touch interfaces.