v0.61

Source: src/base/_colors.scss, line 50

3.1.1 Blue

  • #2077bf;

    $blue
  • #3290de;

    $blue-80

Source: src/base/_colors.scss, line 14

3.1.2 Grey

$grey-80: #020202; $grey: #23292d; $grey-60: #45494c; $grey-40: #6f7376; $grey-20: #a3a5a7; $grey-10: #ececec; $grey-05: #f5f7f8;

Source: src/base/_colors.scss, line 33

3.1.2 Green

  • #66cc00; used only on the GP wordmark

    $gp-green
  • #8bcc49;

    $gp-green-80
  • #e3f2d3;

    $gp-green-20
  • #003300;

    $green
  • #1b4a1b;

    $green-80
  • #d9e6d7;

    $green-20

Source: src/base/_colors.scss, line 72

3.1.3 Orange

  • #f36d3a;

    $orange
  • #ee562d;

    $orange-hover
  • #cd4525;

    $orange-active

Source: src/base/_colors.scss, line 5

3.1.4 Primary

  • #000;

    $black
  • #fff;

    $white

Source: src/base/_colors.scss, line 64

3.1.5 Yellow

  • #ffd204;

    $yellow

Source: src/base/_typography.scss, line 30

3.3.1 Headings

Heading elements <h1> <h6>. All headings use Roboto font.

Example

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog

Markup

<h1>The quick brown fox jumps over the lazy dog</h1>
<h2>The quick brown fox jumps over the lazy dog</h2>
<h3>The quick brown fox jumps over the lazy dog</h3>
<h4>The quick brown fox jumps over the lazy dog</h4>
<h5>The quick brown fox jumps over the lazy dog</h5>
<h6>The quick brown fox jumps over the lazy dog</h6>

Source: src/base/_typography.scss, line 10

3.3.3 Paragraphs

All plain text elements use Lora font.

Example

The quick brown fox jumps over the lazy dog

Markup

<p>The quick brown fox jumps over the lazy dog</p>