Liferay.Design / Lexicon
/
Get StartedResources
Part of Liferay, IncCode/Content LicensesPowered by Gatsby and Netlify

Input Group

Sign In
View in FigmaView in ClayDocumentation

A Text Input with added elements that provide a more complex input structure.

Layout

The layout of a Text Input is flexible, allowing for the addition of elements on either side of the field.

Usually, the components placed around the Text Input are Buttons, Split Buttons, and/or help labels. Help labels clarify values such as currency, unit of measurement, digits, email addresses, etc.

Types

Input Group with Button

input group with left button

input group with right button

URL Input Group

input group for URL

Input Group with units

input group with mass on the left

input group with mass on the right

input group with mass on both sides

input group with mass in the middle and right side

Input Group with Radio or Checkbox

input group with mass on the left

input group with mass on the right

input group with mass on both sides

input group with mass in the middle and right side

Something to improve? Report an issue!
Menu