Blaze UI Input Sizes

Blaze UI is a free open source UI Toolkit that provides a great structure for building websites quickly with a scalable and maintainable foundation. All components in Blaze UI are developed mobile-first and rely solely on native browser features, not a separate library or framework. It helps us to create a scalable and responsive website fast and efficiently with a consistent style.

Blaze UI Input Sizes are used to create the input fields with different sizes using the Blaze UI size classes. We can create the input field of extra-small size to super-large size as per our need.

Blaze UI Input Sizes Classes:

• u-xsmall: This class is used to create the extra-small size input field.
• u-small: This class is used to create the small size input field.
• u-medium: This class is used to create the medium size input field.
• u-large: This class is used to create the large size input field.
• u-xlarge: This class is used to create the extra-large size input field.
• u-super: This class is used to create a super large size input field.

Syntax:

<input class="c-field Input-Sizes-Class" 
 placeholder="..." type="text">

Example 1: The following code demonstrates the Blaze UI Input Sizes using u-xsmall, u-small, and u-medium classes.

Output:

👁 Image

Example 2: The following code demonstrates the Blaze UI Input Sizes using u-large, u-xlarge, and u-super classes.

Output:

👁 Image

Reference: https://www.blazeui.com/components/inputs/