Free worldwide shipping on all orders over $29.95 (T&Cs Apply)

100-DAY RETURNS (T&Cs Apply)

Styles

This page is here to show off styles for standard page elements such as typography, form elements, and icons. These are hard coded in an alternate page template file, named page.style-guide.liquid.

Header Font

Poppins

Characters

ABCČĆDĐEFGHIJKLMNOPQRSŠTUVWXYZŽabcčćdđefghijklmnopqrsštuvwxyzžआईऊऋॠऌॡऐऔअंअँकखगघङचछजझञटठडढणतथदधनपफबभयरवळशषसह1234567890०१२३४५६७८९‘?’“!”(%)[#]{@}/&\<-+÷×=>®©$€£¥¢:;,.*₹


            
$FONT_DISPLAY

Body Font

Roboto

Characters

ABCČĆDĐEFGHIJKLMNOPQRSŠTUVWXYZŽabcčćdđefghijklmnopqrsštuvwxyzžआईऊऋॠऌॡऐऔअंअँकखगघङचछजझञटठडढणतथदधनपफबभयरवळशषसह1234567890०१२३४५६७८९‘?’“!”(%)[#]{@}/&\<-+÷×=>®©$€£¥¢:;,.*₹


            
$FONT_BODY

Font Pairings

Display

Display

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...


            
<h1 class="d1">The spectacle before us was indeed sublime.</h1>
<h1 class="d2">The spectacle before us was indeed sublime.</h1>
<h1 class="d3">The spectacle before us was indeed sublime.</h1>

Font Pairings

Headings

Display

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

The spectacle before us was indeed sublime.

Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable cloud beneath was dished out, and the car seemed to float in the middle of an immense dark sphere...

Type Styles

Basic Font styles

Strong
Emphasis
Inline link
~~Strike~~
^Sup


            
<strong>Strong</strong>
<em>Emphasis</em>
<a href="#">Inline link</a>
<strike>Strike</strike>
<sup>Sup</sup>

Block Quote

Quote

Standard quote

Eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.
The author of the quote

Buttons

Button Types

Standard Buttons

Default button

Button White

Button Primary

Button secondary

Button tertiary

Button disabled

Wide button (no defaults)

Compressed button Compressed button

Colours

Brand Colours

Standard colours

$COLOR_PRIMARY

$COLOR_SECONDARY

$COLOR_TERTIARY

$COLOR_PRIMARY_LIGHT

$COLOR_SECONDARY_LIGHT

$COLOR_TERTIARY_LIGHT


            
$COLOR_PRIMARY
$COLOR_SECONDARY
$COLOR_TERTIARY
$COLOR_PRIMARY_LIGHT
$COLOR_SECONDARY_LIGHT
$COLOR_TERTIARY_LIGHT

Icons

Social Icons

Icons


            
{% include 'icons' with icon: 'facebook' %}
{% include 'icons' with icon: 'instagram' %}
{% include 'icons' with icon: 'pinterest' %}
{% include 'icons' with icon: 'snapchat' %}
{% include 'icons' with icon: 'tumblr' %}
{% include 'icons' with icon: 'twitter' %}
{% include 'icons' with icon: 'vimeo' %}
{% include 'icons' with icon: 'youtube' %}

Icons

Payment icons

Icons


            
{% include 'icons' with icon: 'amazon_payments' %}
{% include 'icons' with icon: 'american_express' %}
{% include 'icons' with icon: 'bitcoin' %}
{% include 'icons' with icon: 'cirrus' %}
{% include 'icons' with icon: 'dankort' %}
{% include 'icons' with icon: 'diners_club' %}
{% include 'icons' with icon: 'discover' %}
{% include 'icons' with icon: 'dogecoin' %}
{% include 'icons' with icon: 'dwolla' %}
{% include 'icons' with icon: 'forbrugsforeningen' %}
{% include 'icons' with icon: 'interac' %}
{% include 'icons' with icon: 'jcb' %}
{% include 'icons' with icon: 'litecoin' %}
{% include 'icons' with icon: 'maestro' %}
{% include 'icons' with icon: 'master' %}
{% include 'icons' with icon: 'paypal' %}
{% include 'icons' with icon: 'visa' %}

Icons

General icons

Icons


            
{% include 'icon-arrow-down' %}
{% include 'icons' with icon: 'cart' %}
{% include 'icons' with icon: 'close' %}
{% include 'icons' with icon: 'hamburger' %}
{% include 'icons' with icon: 'minus' %}
{% include 'icons' with icon: 'plus' %}
{% include 'icons' with icon: 'rss' %}
{% include 'icons' with icon: 'search' %}

Form Styles

Text inputs

Inputs

Text Field Placeholder Disabled Field Label Text Field (Error) Error Message Select Field

Checkboxes

Checkbox Field

Checkbox Field

Checkbox Field

Radios

Option1

Option1

Option1

Textarea File Field


            
.form-vertical

Inline Form

Subscription Form

Inline Form


            
              <div class="inline-form">
                <input type="email" placeholder="Enter your email">
                <button class="button" type="submit">Submit</button>
              </div>

Lists

Unordered, Ordered, and Child lists

Standard Lists

UL (default)

One
Two
Three
Four

Numeric bullet OL

One
Two
Three
Four

Child lists

One
Two
Three, with child list
- First sub item
- Second sub item
- Third sub item, with child list
  - Third level item
  - Another third level item
Four

Tables

Responsive Tables

Responsive Tables

Order	Date	Payment Status	Fulfillment Status	Total
#1001	December 22, 2015	Authorized	Unfulfilled	$43.03
#1002	December 23, 2015	Authorized	Unfulfilled	$44.03
#1003	December 24, 2015	Authorized	Unfulfilled	$45.03
#1004	December 25, 2015	Authorized	Unfulfilled	$46.03
#1005	December 26, 2015	Authorized	Unfulfilled	$47.03
#1006	December 27, 2015	Authorized	Unfulfilled	$48.03