Dit is
de styleguide van Reservato.

Benieuwd naar de huisstijl van Reservato? In deze styleguide vind je elementen terug voor de website.

Aan de slag

Color palette

Dit is een overzicht van de kleuren (+de hex codes en gradiënten) en voorkomen op de website, Deze kleuren staan ook in de Theme opties zodat ze makkelijk te bereiken zijn tijdens het vormgeven.

#000000

#050E30

#F9B010

#F5F5F5

#FFFFFF

Typography

Hieronder een visuele weergave van het typografie. Alle letters van het alfabet, in de vorm van kleine letters en hoofdletters, de cijfers 1 tot en met 10, en een aantal veel gebruikte leestekens. Daarnaast zie je hoe het de typografie tot zijn rechtkomt bij een titel en regulier zin.

Tone of voice

Informeel, formeel

Font 1.0

abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890 !?@#%&*()/

regular

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Font 2.0

abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890 !?@#%&*()/

regular

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Text styles

Hieronder zie je hoe de kopteksten, bodytekst en list items worden gebruikt.

Heading 1

Lorem ipsum dolor

Heading 2

Lorem ipsum dolor

Heading 3

Lorem ipsum dolor

Heading 4

Lorem ipsum dolor

Body

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Quote

"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."

List

  • Lorem ipsum dolor
  • Ut enim ad minim veniam
  • Lorem ipsum
  • Consectetur adipiscing elit

Link

Lorem ipsum dolar

List

  1. Lorem ipsum dolor
  2. Ut enim ad minim veniam
  3. Lorem ipsum
  4. Consectetur adipiscing elit

All in one

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  1. Lorem ipsum dolor
  2. Ut enim ad minim veniam
  3. Lorem ipsum
  4. Consectetur adipiscing elit

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

  • Lorem ipsum dolor
  • Ut enim ad minim veniam
  • Lorem ipsum
  • Consectetur adipiscing elit

Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam? Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Text styles

Hieronder zie je hoe de kopteksten, bodytekst en list items worden gebruikt.

Heading 1

Lorem ipsum dolor

Heading 2

Lorem ipsum dolor

Heading 3

Lorem ipsum dolor

Heading 4

Lorem ipsum dolor

Body

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Quote

"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."

List

  • Lorem ipsum dolor
  • Ut enim ad minim veniam
  • Lorem ipsum
  • Consectetur adipiscing elit

Link

Lorem ipsum dolar

List

  1. Lorem ipsum dolor
  2. Ut enim ad minim veniam
  3. Lorem ipsum
  4. Consectetur adipiscing elit

All in one

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  1. Lorem ipsum dolor
  2. Ut enim ad minim veniam
  3. Lorem ipsum
  4. Consectetur adipiscing elit

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

  • Lorem ipsum dolor
  • Ut enim ad minim veniam
  • Lorem ipsum
  • Consectetur adipiscing elit

Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam? Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Text styles I

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum

Lorem ipsum dolor sit amet.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Suspendisse egestas est ac? Dolor imperdiet pretium.

Text styles II

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo. Suspendisse egestas est ac dolor imperdiet pretium. Lorem ipsum dolor sit amet, consectetur.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Lorem ipsum.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Icons

Icon nummer 1

Icon nummer 2

Icon nummer 3

Icon nummer 4

Buttons

Button style with light background color

Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor

Blockquote

SHARED BY

Reservato

Nullam eros mi? Mollis in sollicitudin non. Tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Button style with background color #086373

Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor

Buttons style with background color #00a5a3

Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor

Forms styles I

Lorem ipsum dolor sit amet.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

*Sed et felis metus, rhoncus ornare nibh.

Forms styles II

Lorem ipsum dolor sit amet.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

*Sed et felis metus, rhoncus ornare nibh.

Verbeter vandaag nog jouw vindbaarheid.

Start direct met ads en laat ons werken aan de organische vindbaarheid.

Wees zichtbaar

Direct zichtbaar voor jullie doelgroep dankzij Google ads.

Verbeter de vindbaarheid

Content wordt doorlopend gemaakt en geoptimaliseerd.

Bescherm jouw rankings

Alles wat nieuw is wordt direct toegepast zodat je nooit silstaat.

Lorem ipsum

Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor incididunt labore dolore magna alirua enim minim veniam nostrud exerci tation ullamco laboris aliruip noname.

N

Consectetur adipiscing elit

N

Duis aute irure dolor in

N

Consectetur adipiscing elit

Lorem ipsum dolor

Lorem ipsum

Lorem ipsum dolor sit amet.

Nullam eros mi, mollis in sollicitudin non, tincidunt sed enim. Sed et felis metus, rhoncus ornare nibh. Ut at magna leo.

Lorem ipsum dolor

Excepteur sint occaecat

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur excepteur sint occaecat.

01.

Exceur Sint Lorem

Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor labore dolore magna alirua enim minim lorem ipsum dolor amet sit veniam.

02.

Exceur Sint Lorem

Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor labore dolore magna alirua enim minim lorem ipsum dolor amet sit veniam.

03.

Exceur Sint Lorem

Lorem ipsum dolor amet consec tetur adipiscing elit eiusmod tempor labore dolore magna alirua enim minim lorem ipsum dolor amet sit veniam.

Lorem ipsum dolar

Excepteur Sint Accaecat Dolor Cupidatat Ron.

Perspiciatis unde omnis iste natus sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae. Ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia sit aspernatur aut.

"Nunc consequat justo eget enim finibus porta. Suspendisse orci nunc, rutrum quis nunc sed, feugiat hendrerit massa. In cursus ornare sollicitudin."

Michael Doe - Customer

Verbeter vandaag nog jouw vindbaarheid.

Start direct met ads en laat ons werken aan de organische vindbaarheid.

Wees zichtbaar

Direct zichtbaar voor jullie doelgroep dankzij Google ads.

Verbeter de vindbaarheid

Content wordt doorlopend gemaakt en geoptimaliseerd.

Bescherm jouw rankings

Alles wat nieuw is wordt direct toegepast zodat je nooit silstaat.