Segmented Control

Tired of clunky toggles and outdated selection components? Meet Segmented Control for Angular Material – a sleek, modern, and highly customizable component that brings intuitive navigation to your Angular apps.

Key features:
  • ✅ Material 3 Inspired – Fully integrates with Angular Material for a seamless design experience.
  • 🎨 Customizable – Play with colors, sizes, and styles to match your brand.
  • ⚡ Lightning Fast & Lightweight – Built for performance without unnecessary bloat.
  • 📱 Touch & Keyboard Friendly – Perfect for mobile and desktop interactions.
  • 🛠️ Easy to Use – Drop it in, configure it, and watch your UI shine!

Upgrade your Angular UI with Segmented Control and give your users the fluid, elegant selection experience they deserve! 🚀

Basic segmented control

Loading...

Segmented control sizes

Loading...

Segmented control disabled

Loading...

Segmented control with icons

Loading...

Segmented control with icons only

Loading...

API Reference

Properties for the emr-segmented component.

PropTypeDefault
selectedValue
Sets a value, manually
any
disabled
Disable a control
booleanfalse
size
Control size
SegmentedTriggerSize: 'sm' | 'default' | 'lg' | stringdefault

Properties for the emr-segmented-button component.

PropTypeDefault
value*
Value of a button
any
disabled
Disable a button
booleanfalse
iconOnly
Hide text and show icon only
booleanfalse