Field cases for styleguide

Free UI Style Guide Kit


Download Sketch File

Client  ProteusThemes
Role User Interface
Date October 2017

ProteusThemes company develops great WordPress themes. Besides helping design new user flow through the new website I prepared a carefully designed style guide for developers to follow. In one particular moment, it was needed to make several new pages for the checkout process and customer support pop-up screens. To keep all the future input fields in line with the style I created a clear and easy style guide to follow and use to develop possible new variants of input fields. The style guide was designed in Sketch app and is also available for download.

Color Palette & Typography

Ui Styleguide Colors

Typography for User Interface

Check Box Variations

Check box design

Input Fields Variations

Input fields variations

Small & Big Search Fields

Search field design

Suggestive search fields

Dropdown Fields

Dropdown input fields

Special Message Fields

Error messag alerts


This is a unique website which will require a more modern browser to work!

Please upgrade today!