voog.design

Forms

Voog forms

Voog provides a constrained, purposeful set of typographic styles. These styles map as much as possible to functional roles so you know when each can be used.

Input fields

Meggings cred before they sold out messenger bag, ugh fashion axe Pitchfork.

WEBC 1.0

Default form input with placeholder.

WEBC 1.0.1

Active form input.

WEBC 1.0.2

Form input with data.

Error message

WEBC 1.0.3

Form input error message.

Additional information

WEBC 1.0.4

Form input with additional information.

WEBC 1.0.5

Form input with loading indicator.

WEBC 1.0.6

Disabled form input.

WEBC 1.0.7

Disabled copy field.

WEBC 1.0.8

Input with prefix.

Selection controls

Meggings cred before they sold out messenger bag, ugh fashion axe Pitchfork.

WEBC 1.1

Toggle button.

WEBC 1.1.1

Toggle button, active.

  • Site title - Page name

  • Site title x Page name

  • Site title | Page name

WEBC 1.4

Dropdown

  • Option A

  • Option B

  • Option C

WEBC 1.4.0.1

Dropdown (multi)