Opens in a new tab

Forms

One form, four looks

The Bricks Form element with the fbk-form classes: boxed, underline, floating label and one row. Every field type (text, email, select, date, number, radio, checkbox, file, message) with its focus and its error message in every style. Send an empty form to see the errors.

Boxed (fbk-form)

Budget
Services
Privacy

Underline (fbk-form--line)

Budget
Services
Privacy

Floating label (fbk-form--float)

Budget
Services
Privacy

Floating label + underline

Budget
Services
Privacy

Phone with country code

In one row: newsletter (fbk-form--inline)

On dark backgrounds

The same classes on a dark section: fields, borders and the accent adapt by themselves.

Boxed (fbk-form)

Budget
Services
Privacy

Underline (fbk-form--line)

Budget
Services
Privacy

Floating label (fbk-form--float)

Budget
Services
Privacy

Floating label + underline

Budget
Services
Privacy

Phone with country code

In one row: newsletter (fbk-form--inline)