...
För webb och tjänster som riktar sig till invånare används röd färg i H1 och H2 rubriker, medan webb och tjänster som riktar sig till professionen har mörkgrå färg i H1 och H2 rubriker.
Se även detaljerade exempel för tjänster riktade mot invånare respektive profession.
Tvåfärgade rubriker i kärnbudskap
...
Benämning | Typsnitt | Färg (inv/prof) | Desktop | Tablet | Mobil |
---|---|---|---|---|---|
H1 | Inter, Bold | #C12143 / #353535 | 48/52 (-1,25) | 32/40 (-0,83) | 32/40 (-0,83) |
H2 | Inter, Bold | #C12143 / #353535 | 24/30 (-0,5) | 22/28 (-0,3) | 22/28 (-0,3) |
H3 | Inter, Bold | #353535 | 20/24 (-0,4) | 20/24 (-0,4) | 20/24 (-0,4) |
H4 | Inter, Bold | #353535 | 16/20 | 16/20 | 16/20 |
Ingress/preamble | Open sans, Light | #353535 | 22/36 | 18/28 | 18/28 |
Paragraf | Open sans, Regular | #353535 | 16/24 | 16/24 | 16/24 |
Paragraf, länk | Open sans, Regular | #396291 + underline | 16/24 | 16/24 | 16/24 |
Paragraf, länk hover | Open sans, Regular | #3B4266 + underline | 16/24 | 16/24 | 16/24 |
Paragraf, länk besökt | Open sans, Regular | #3B4163 + underline | 16/24 | 16/24 | 16/24 |
Small text | Open sans, Regular | #353535 | 14/20 | 14/20 | 14/20 |
Sidlistning | Inter, Bold | #A00B36 | 20/24 (-0,4) | 20/24 (-0,4) | 20/24 (-0,4) |
Underrubrik | Inter, Regular, Versaler | #353535 | 20/24 | 20/24 | 20/24 |
Underrubrik, mini | Inter, Regular, Versaler | #353535 | 14/20 | 14/20 | 14/20 |
Lokal navigering | Open sans, Regular | #A00B36 | 16/22 | 16/22 | 16/22 |
Lokal navigering, vald | Open sans, Regular | #6A0032 | 16/22 | 16/22 | 16/22 |
Lokal navigering hover | Open sans, Regular | #6A0032 | 16/22 | 16/22 | 16/22 |
...
Läs mer om riktlinjer för typografi på 1177 Vårdguidens varumärkesmanual:
https://www.1177.se/riktlinjer-och-material/om-varumarket/Varumarkesmanual/visuell-identitet/typografi/
Do’s and Don’ts
Använd röd färg till H1 och H2 för tjänster som riktar sig till invånare.
Använd grå färg till H1 och H2 för tjänster som riktar sig till profession.
Använd enfärgade rubriker generellt i puffar, sektionssidor, samlingssidor och artikelsidor.
Använd tvåfärgade rubriker till varumärkesspecifika rubriker på webben, t.ex. huvudpuff samt i sidfoten.
...
Kontrastvärdena ska uppfylla kraven för WCAG 2.1, AA.
Kontrollera alltid kontrastvärdet mellan text och bakgrund.
Research på komponenten
-
Relaterade
...
resurser/komponenter
Här hittar du våra typsnitt:
Open Sans: https://fonts.google.com/specimen/Open+Sans
Inter: https://rsms.me/inter/
Se även mer information Läs mer om riktlinjer för typografi på Varumärkesmanual 1177 Vårdguiden - typografi
...