Grafisk manual: Typografi och färg

Detta är Nordens Fotoskolas design och stilguide för hemsidan 2020.

Rubriker

H1: En rubrik med Arvo – 3,3 em

H2: En rubrik med Arvo – 2,8 em

H3: En rubrik med Arvo – 2,3 em

H4: En rubrik med Arvo – 1,7 em

H5: Denna ingress är toppen (Roboto Slab – 1,3 em)
H6: Detta är en mellanrubrik (Roboto, 1,1 em)

Ingress

Detta är en ingress i H5. Den skiljer sig från ett blogginlägg genom att den finns kvar på samma plats och kommer direkt efter rubriken på sidan. Här sammanfattas det viktigaste och är en ingång till artikeln. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Brödtext

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris leo metus, scelerisque ac velit in, vestibulum posuere mi. Maecenas euismod erat non massa egestas, non finibus odio consequat. Morbi commodo finibus urna aliquam accumsan. Nunc nec blandit risus. 

En mellanrubrik i H6

Praesent ullamcorper urna at felis dapibus suscipit. Vestibulum porttitor sit amet lectus a rhoncus. Nullam quis lorem accumsan, viverra nunc ut, efficitur velit. Duis in metus ullamcorper mi rhoncus aliquam. Maecenas dignissim nisi at feugiat ornare. Cras eleifend auctor eros eget pharetra. Sed luctus vehicula molestie.

Länkar

Peka på denna länk för att se hur den fungerar. Länken har samma färg som brödtexten men är understruken. Som du märker när du har pekaren på länken blir den orange och det understrukna försvinner.

Citat

Duis in metus ullamcorper mi rhoncus aliquam. Maecenas dignissim nisi at feugiat ornare.

Duis in metus ullamcorper mi rhoncus aliquam. Maecenas dignissim nisi at feugiat ornare.

Knappar

Arvo, versaler

Arvo, versaler

Roboto, versaler

Roboto, versaler

Roboto Slab, versaler

Roboto Slab, versaler

Arvo, versaler

Arvo, versaler

Roboto, versaler

Roboto, versaler

Roboto Slab, versaler

Roboto Slab, versaler

Färger (primära)

HEX: #EC6622
RGB:207/105/48
CMYK: 0/70/90/0

HEX: #A66500
RGB: 151/104/26
CMYK: 0/50/100/40

HEX: #A85DA1
RGB 149/95/155
CMYK 40/72/0/0

HEX: #E57DB0
RGB 203/125/170
CMYK 6/63/0/0

Färger (komplement)

HEX: #FBB900
RGB:234/185/12
CMYK: 0/30/100/10

HEX: #000000
RGB: 0/0/0
CMYK: 0/0/0/100

HEX: #9D978B
RGB: 156/151/139
CMYK: 6/10/20/45

HEX: #D9DADA
RGB: 216/217/218
CMYK: 0/0/0/20

Färger (komplement)

HEX: #0098D3 RGB:0/150/206 CMYK: 100/0/5/5

HEX: #000000
RGB: 0/0/0
CMYK: 0/0/0/100

HEX: #9D978B
RGB: 156/151/139
CMYK: 6/10/20/45

HEX: #D9DADA
RGB: 216/217/218
CMYK: 0/0/0/20

Test

En rubrik i H1 i denna test

Detta är en ingress i H5. Den skiljer sig från ett blogginlägg genom att den finns kvar på samma plats och kommer direkt efter rubriken på sidan. Här sammanfattas det viktigaste och är en ingång till artikeln. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris leo metus, scelerisque ac velit in, vestibulum posuere mi. Maecenas euismod erat non massa egestas, non finibus odio consequat. Morbi commodo finibus urna aliquam accumsan. Nunc nec blandit risus. Ut faucibus, ipsum eu pharetra dictum, lorem elit auctor nulla, non varius magna velit quis tortor. Sed et risus blandit, eleifend diam vel, lobortis turpis. Vivamus fringilla, nisl non ornare porttitor, neque eros ultricies eros, laoreet ultrices nisi urna scelerisque massa. Nulla eget eros vitae enim varius commodo. Nam venenatis, mi eu condimentum sollicitudin, turpis tellus placerat turpis, nec porttitor risus mauris a augue. Donec placerat ligula feugiat venenatis commodo. Morbi eget turpis nec ante pulvinar feugiat.

En mellanrubrik i H6

Praesent ullamcorper urna at felis dapibus suscipit. Vestibulum porttitor sit amet lectus a rhoncus. Nullam quis lorem accumsan, viverra nunc ut, efficitur velit. Duis in metus ullamcorper mi rhoncus aliquam. Maecenas dignissim nisi at feugiat ornare. Cras eleifend auctor eros eget pharetra. Sed luctus vehicula molestie.

Prenumerera på vårt nyhetsbrev!

I nyhetsbrevet informerar vi bland annat om när det är dags att söka till Nordens Fotoskola eller kanske om det är någon ny examensutställning på gång.
Genom att klicka på prenumerera här ovan samtycker du till att Nordens Fotoskola lagrar din e-postadress i vår databas, i enlighet med dataskyddsförordningens (GDPR) direktiv.