Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Required Label
A React form label with red asterisk indicating required field using shadcn/ui Label component for form validation visual cues
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
That little red asterisk speaks volumes. This React pattern shows Label with Email text and text-destructive asterisk—the universal symbol telling users this field is mandatory. Built with shadcn/ui Label component, it's perfect for form validation, required field indicators, user registration, contact forms, or any form where distinguishing required from optional fields reduces submission errors and user frustration.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Optional Label
Label with (optional) text
Error Label
Label with error message
Label with Description
Label with helper text
Form
Complete form component
Input Field
Text input component
Form Validation
Form with validation
Questions you might have
React kbd - Unicode Symbols
A React keyboard display showing Enter, Delete, and Tab using Unicode symbols with shadcn/ui Kbd for lightweight key representation
React Label with Description
A React form label with muted helper text description using shadcn/ui Label for providing contextual field guidance