HTML-Prototype von in2code

Settings

Colors

  • #98C6EA

    blue-light-283

  • #64A0C8

    blue-light-542

  • #3070B3

    blue

  • #0065BD

    blue-medium

  • #005293

    blue-dark-540

  • #003359

    blue-dark-301

  • #FFFFFF

    white

  • #FCFCFC

    grey-100

  • #E6E6E6

    grey-200

  • #B3B3B3

    grey-300

  • #898989

    grey-400

  • #737373

    grey-500

  • #404040

    grey-600

  • #141414

    grey-700

  • #000000

    black

  • #F3ECDC

    beige

  • #A2AD00

    green

  • #F08159

    orange-light

  • #E37222

    orange

  • #B55CA5

    purple

  • #D00F26

    red

  • #847EBB

    state-blue

  • #F8B31F

    yellow

Fonts

Toggle full screen Open in new window Toggle example guides Toggle HTML markup

<insert-markup>1.2-</insert-markup>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

em: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Strong: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Strong/em: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Markup: templates/output/01-settings/fonts.html 

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
<p><em>em: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</em></p>
<p><strong>Strong: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</strong></p>
<p><strong><em>Strong/em: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</em></strong></p>
Source: assets/sass/01-settings/_settings.fonts.scss, line 15