Färger i digitala kanaler

Profilfärger

Här kan du lägga till färgbiblioteket (Adobe licens krävs) för digital användning.

Kommunen använder fyra olika färgteman i sin kommunikation som utgår från fyra basfäger - lila, grön, blå och grå. Varje basfärg har sex ljusare toner och två komplementfärger i sitt färgtema.

Våra webbplatser använder sig av alla fyra färgteman. Våra utvecklare använder de engelska namnen på färgerna i sin kod som du ser nedan.

Färgerna finns också presenterade med sina svenska namn under avsnittet grafisk profil på sidan Färger.

Purple 100

RGB 69.0.92

#45005C

Purple 90

RGB 100.28.125

HEX #641C7D

Purple 80

RGB 122.48.147

HEX #7A3093

Purple 60

RGB 155.100.174

#9B64AE

Purple 40

RGB 208.160.224

#D0A0E0

Purple 20

RGB 235.204.245

HEX #EBCCF5

Purple 10

RGB 248.236.252

#F8ECFC

Purple accent1

RGB 255.61.156

#FF3D9C

Purple accent2

RGB 231.52.132

#D63385

  

Green 100

RGB 0.85.92

#00555C

Green 90

RGB 28.110.117

HEX #1C6E75

Green 80

RGB 47.127.134

HEX #2F7F86

Green 60

RGB 99.159.164

#639FA4

Green 40

RGB 153.203.207

#99CBCF

Green 20

RGB 188.225.228

HEX #BCE1E4

Green 10

RGB 229.243.245

#E6F3F5

Green accent1

RGB 166.207.56

#A6CF38

Green accent2

RGB 0.138.0

HEX #008A00

  

Blue 100

RGB 38.34.98

#262262

Blue 90

RGB 60.56.130

HEX #3C3882

Blue 80

RGB 77.71.151

HEX #4D4797

Blue 60

RGB 125.122.174

#7D7AAE

Blue 40

RGB 179.175.216

#B3AFD8

Blue 20

RGB 213.209.234

HEX #D5D1EA

Blue 10

RGB 243.242.250

#F3F2FA

Blue accent 1

RGB 28.156.217

#1C9CD9

Blue accent 2

RGB 22.126.176

#177DB0

  

Grey 100

RGB 32.46.69

HEX #202E45

Grey 90

RGB 58.70.90

HEX #3A465A

Grey 80

RGB 79.88.107

HEX #4F586B

Grey 60

RGB 121.130.144

HEX #798290

Grey 40

RGB 166.171.180

HEX #A6ABB4

Grey 20

RGB 221.224.226

HEX #DDE0E2

Grey 10

RGB 242.242.244

HEX #F2F2F4

Grey accent 1

RGB 133.158.150

HEX #859E96

Grey accent 2

RGB 103.122.117

HEX #667A75

Signalfärg

Signalfärg som används i logotypen och kan användas för att förstärka vissa ord i rubriker eller lyfta ikoner eller länkar mot mörk bakgrund. Färgen används även t.ex. som bakgrund på informationsbanner på uppsala.se.

Läs mer om hur signalfärgen kan användas i rubriker under Grafisk profil/Typografi

Global accent yellow

RBG 254.221.0

HEX #FEDD00

Funktionsfärger

För digitala gränssnitt finns även ett antal funktionsfärger som kan användas på länkar, ikoner, knappar och ytor. Några av dem är hämtade från profilfärgerna, andra är kompleterande.

Global link blue

RGB 33.42.161

HEX #212AA1

Länkfärg. Om länken har en boarder är den i temafärg 20 mot vit bakgrund eller 40 mot tonad bakgrund. Vid hover ändrar boardern färg till blå länkfärk, vilket ger känslan av att den lyser upp när användaren går över med muspekaren.

Purple 80

RGB 122.48.147

HEX #7A3093

Besökta länkar

Global warning red

RGB 224.20.69

HEX #E01445

Varningsfärg, används i krismeddelande och felmeddelande.

Green accent2

RGB 0.138.0

HEX #008A00

Positiv färg, används för positvit återkoppling eller till exempel på startknapp till en tjänst.

Global accent white

RGB 255.255.255
HEX #FFFFFF

Bakgrundsfärg eller textfärg mot mörk bakgrund. Används även som hoverfärg för ljusa länkar, det ger känslan av att länken lyser upp när användaren går över med muspekaren.

Knappfärger

Våra knappar går i samma temafärg som övriga webbsidan. Har webbsidan blått tema är knappen Blue 80 med Blue 100 som hoverfärg. Om knappen ska ligga mot mörk bakgrund är knappen Blue 20 med vit hoverfärg.

  

Blue 80

RGB 77.71.151

HEX #4D4797

Green 80

RGB 47.127.134

HEX #2F7F86

Purple 80

RGB 122.48.147

HEX #7A3093

Grey 80

RGB 79.88.107

HEX #4F586B

Blue 20

RGB 213.209.234

HEX #D5D1EA

Green 20

RGB 188.225.228

HEX #BCE1E4

Purple 20

RGB 235.204.245

HEX #EBCCF5

Grey 20

RGB 221.224.226

HEX #DDE0E2