Grafisk manual för linkoping.se
Typografi
| Blått tema: | Grått tema: | |
| Rubrik 1 (H1): PT Serif, 32pt, font-weight 500 | #00818F | #333333 |
| Rubrik 2 (H2): Arial, 22pt, font-weight 500 | #00818F | #333333 |
| Rubrik 3 (H3): Arial, 18pt, font-weight 500 | #00818F | #333333 |
| Ingress: Arial bold, 16px | #333333 | #333333 |
| Brödtext: Arial, 16px | #333333 | #333333 |
| Bildtext: Arial, 12px | #333333 | #333333 |
| Citat: PT Serif, 28px | #00818F | #333333 |
| Upphovsman citat: Arial, 12px | #00818F | #333333 |
Färger
För att skilja våra rubriker från brödtexten så har våra rubriker både en annan färg och större storlek. Textfärgen måste vara minst 74% av vår mörkblå mot vit bakgrund för att klara gränsen för WCAG nivå AA. För att klara nivå AAA behöver textfärgen vara minst 92% av vår mörkblå.
Toppmeny
| Blått tema: | Grått tema: | |
| Text | #FFFFFF | #FFFFFF |
| Bakgrund | #00818F | #494949 |
| Bakgrund hover | #005365 | #262626 |
| Bakgrund focus | #005365 | #262626 |
Undermeny
| Blått tema: | Grått tema: | |
| Text | #FFFFFF | #FFFFFF |
| Bakgrund | #00818F | #494949 |
| Bakgrund hover | #005365 | #262626 |
| Bakgrund focus | #005365 | #262626 |
Menyrubrik
background-color: #407e8c (75% mörkblå)
color: #ffffff (vit)
font-weight: bold
Nivå 1
background-color: #ffffff (vit)
color: #005365 (100% mörkblå)
Nivå 2
background-color: #d9e5e8 (15% mörkblå)
color: #005365 (100% mörkblå)
Nivå 3
background-color: #ffffff (vit)
color: #005365 (100% mörkblå)
Linjer mellan varje rad
border-color: #a6c3c9 (35% mörkblå)
border-style: solid
border-width: 1px 0
border-radius: 0
Minimerad meny
Ikon från Font Awesome
Ikon: plus
color: #407e8c (75% mörkblå)
Maximerad meny
font-weight: bold
Ikon från Font Awesome
Ikon: minus
color: #407e8c (75% mörkblå)
Vid focus
background-color: #005365 (100% mörkblå)
color: #ffffff (vit)
font-weight: bold
Ikon från Font Awesome
color: #ffffff (vit)
Länk
border-radius: 3px
Ikoner från Font Awesome
Intern länk: chevron-right
Extern länk: external-link
Länk till e-postadress, mailto: at
Länk till PDF: file-pdf-o
Länk till Wordfil: file-word-o
Länk till Excelfil: file-excel-o
Länk till powerpoint: file-powerpoint-o
Knappar
background-color: #407e8c (75% mörkblå)
color: #ffffff (vit)
border-color: #266d7c (85% mörkblå)
border-style: solid
border-width: 1px
border-radius: 3px
Vid hover
background-color: #0d5c6d (95% mörkblå)
border-color: #005365 (100% mörkblå)
Vid focus
background-color: #005365 (100% mörkblå)
border-color: #005365 (100% mörkblå)
Sidfot
background: linear-gradient(to bottom,#407e8c 0%,#005365 39%,#005365 100%) (75-100% mörkblå)
Ikoner
Font awesome
| Blått tema: | Grått tema: | |