# input × # floating-label

Components⚛ TSX Live preview

Floating label inputs

Labels rise, shrink and turn cyan when the field focuses or has content — classic material-style form polish.

34200Open

Floating Glow Input · Ultra Violet

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Ultra Violet palette.

58400Open

Floating Glow Input · Cyber Lime

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Cyber Lime palette.

52100Open

Floating Glow Input · Sunset Amber

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Sunset Amber palette.

9600Open

Floating Glow Input · Rose Gold

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Rose Gold palette.

49400Open

Floating Glow Input · Ocean Sky

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Ocean Sky palette.

41800Open

Floating Glow Input · Mint Breeze

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Mint Breeze palette.

55800Open

Floating Glow Input · Candy Pink

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Candy Pink palette.

61000Open

Floating Glow Input · Royal Gold

A text field with a floating label and a gradient focus ring that breathes. Rendered in the Royal Gold palette.