Semantic UI: Button

Form

Forms are a useful grouping of related elements requiring user input.

Forms always include fields, and fields always contain form elements. Fields themselves may also include: standard form fields, like labels, inputs and textareas, as well as: checkboxes, sliders, and message blocks.

Message blocks are ui text blocks which are formatted for use inside forms.

Standard

States

Variations

Group

Standard

All Together (Form):

Please enter your first name
Please enter your last name

First Name

Last Name

I agree to the terms and conditions

Submit

Types of Content

Field:

User Input

Text Area:

User Text

Checkbox:

Checkbox (Using attribute ID to trigger checked event)

Checkbox (Javascript)

Messages:

Please enter your first name
Please enter your last name

States

If form is in state state, it will automatically show any error message block:

Don't try to do that you're crazy!

If form is in warning state, it will automatically show any warning message block:

Please enter your first name
Please enter your last name

Form

Standard

All Together (Form):

Types of Content

Field:

Text Area:

Checkbox:

Messages:

States

If form is in state state, it will automatically show any error message block:

If form is in warning state, it will automatically show any warning message block:

Variations

Fields (Group)