Foundation
Color
| id: | |
|---|---|
| hex: | |
| rgba: |
| Less: | $ |
|---|---|
| CSS Variable: | var(--) |
| hex: | |
| rgba: |
Secondary color: navy
Wcag AA (font size: 18px)
Colors for all products and services used across all channels. Choose grid view for an overview of all available colors.
base
Base Colors
A collection of base colors, used widely throughout the system.
Color Name Description Value red
A11y approved red
#ed0000 red-corporate-brand
Use only on corporate brand
#ff0000 red-100
#ffeceb black
#000000 white
#ffffff yellow
#ffbb00 green
Button color in completed forms and betslip.
#008912 blue
#256FEA navy
Default font color
#001932 navy-700
Complementary navy
#4D5E70 orange
#ff5500 Communication
Color Name Description Value communication-blue
Ikonfärg för kundsidor
#91c5d5 communication-green
#b1cc8a Data visualization
Colors used to visualise data
Color Name Description Value data-primary-tur
#BFF1BF data-secondary-tur
#00D773 data-primary-sport
#8EF0FF data-secondary-sport
#00BEFA data-01
#001932 data-02
#FA50A5 data-03
#FF4D00 data-04
#ED0000 data-05
#9664FF data-06
#0000F5 data-07
#00AB5C data-08
#0998FF data-09
#124600 data-10
#008912 data-11
#FF6109 data-12
#6218FF data-13
#E150FD data-14
#003569 data-15
#5E0097 Greyscale
Only white / black / grey colors
Color Name Description Value grey-800
#252526 grey-700
Prominent Font
#323233 grey-600
Normal Font
#4b4b4d grey-500
#7d7d80 grey-400
#afafb3 grey-330
#d4d4d9 grey-300
#e1e1e5 grey-200
#ededf2 grey-100
#fafaff Navigation
Colors only connected to navigation.
Color Name Description Value navigation-700
#3e3e40 navigation-500
#646466 Opacity - Dark
A collection of colors only using rgba opacity.
Color Name Description Value opacity-10
rgba(0, 0, 0, .1) opacity-20
rgba(0, 0, 0, .2) opacity-30
rgba(0, 0, 0, .3) opacity-40
Overlay Start
rgba(0, 0, 0, .4) opacity-60
Overlay Start
rgba(0, 0, 0, .6) opacity-80
Overlay
rgba(0, 0, 0, .8) Opacity - Light
A collection of light opaque colors only using rgba opacity.
Color Name Description Value opacity-white-10
Overlay Start
rgba(255, 255, 255, .1) opacity-white-20
Overlay Start
rgba(255, 255, 255, .2) opacity-white-30
Overlay Start
rgba(255, 255, 255, .3) opacity-white-40
Overlay Start
rgba(255, 255, 255, .4) opacity-white-60
rgba(255, 255, 255, .6) opacity-white-80
rgba(255, 255, 255, .8)
sport
Sport - Base colors
Sport base colors
Color Name Description Value sport
#00befa sport-50
#f1f6f7 sport-100
#D9FDFF sport-200
#c3fbff sport-400
Legal bar background
#e5eff2 sport-800
#004257 sport-900
Complement to navy
#596d7f Bingo
Färger för Bingo
Color Name Description Value bingo-50
#fae8f3 bingo-100
#eeb6d9 bingo-250
#e693c7 bingo-350
#db62ad bingo-400
#d4439d bingo-550
#c91485 bingo-600
#b71279 bingo-750
#8f0e5e bingo-800
#6f0b49 bingo-900
#540838 bingo-gradient
Gradient
linear-gradient(90deg, #8F0E5E 0%, #C91485 29.99%, #C91485 70.01%, #8F0E5E 100%) bingo-gold-foil-gradient
Gradient
linear-gradient(115deg, #685232 47.49%, #C8AE86 72.29%, #F1D4AA 78.95%, #C8AE86 84.71%, #685232 97.43%) bingo-gold-foil-gradient-2
Gradient
linear-gradient(98deg, #685232 68.85%, #C8AE86 85.28%, #685232 97.43%) Casino - Kategorier
Färger för Casino Kategorier
Color Name Description Value casino-category-100
#F4AA51 casino-category-200
#9E11A2 casino-category-300
#D9438A casino-category-400
#20CCBA casino-category-500
#1D2F6F casino-category-600
#8490FA casino-category-700
#32C5FF casino-category-800
#49116A casino-category-900
#1E796D casino-category-1000
#E794B4 Casino - Live kategorier
Färger för Casino Live Kategorier
Color Name Description Value casino-live-category-100
#ED5B93 casino-live-category-200
#5E0D70 casino-live-category-300
#C1264F casino-live-category-400
#0B2D4F casino-live-category-500
#00584B casino-live-category-600
#2C39A4 casino-live-category-700
#820059 casino-live-category-800
#00919C casino-live-category-900
#2196C4 casino-live-category-1000
#3C0A7A Casino
Casino colors
Color Name Description Value casino
#FF80A4 casino-1100
#00132F casino-1000
#001932 casino-900
#0000BB casino-800
#0047AF casino-700
#7400BB casino-600
#FF3B78 casino-500
#E83178 casino-400
#FF4E8F casino-300
#FF3D7B casino-200
#DC5C80 casino-100
#FFDBDB Challenge
Color Name Description Value challenge
Topp, Ruta med siffra, Markera checkbox, Aktiva pilar, TV-ikon
#55042a challenge-100
Lagnamn i toppswipe
#e60000 Competition
Competition colors. Used by Tips-SM.
Color Name Description Value competition
Background tone
#2C5489 competition-800
Shield tone
#80A0BC competition-700
Shield tone
#95ABC4 competition-600
#D5E3EF competition-500
#403523 competition-400
Golden tone
#B09054 competition-300
Golden border
#DFB76B competition-200
Golden tone
#E7CB95 competition-100
Golden tone
#FFE9BF Europatipset
Color Name Description Value europatipset
Header, Ruta med siffra, Markerad checkbox, Aktiva pilar, TV-ikon, Lagnamn i toppswipe
#008733 europatipset-700
Markering i toppswipe
#003314 europatipset-600
Actionbar
#004018 europatipset-500
Infobar, Toppswipe
#004d1d europatipset-300
System
#00732b europatipset-200
Background
#1a8044 europatipset-100
Header Button
#00a13e Extratipset
Color Name Description Value extratipset
Header, Ruta med siffra, Markerad checkbox, Aktiva pilar, TV-ikon, Lagnamn i toppswipe
#0069a8 extratipset-700
Markering i toppswipe
#005384 extratipset-600
Actionbar
#005384 extratipset-500
Infobar, Toppswipe
#0069a8 extratipset-300
System
#0069a8 extratipset-200
Background
#ffda05 extratipset-100
Header Button
#0069a8 Fullträff
Color Name Description Value fulltraff
Primary color
#660099 fulltraff-900
Accent/splash
#66ff99 fulltraff-800
Accent/splash
#ff6d03 fulltraff-700
Accent/splash
#ff00ff fulltraff-400
Tones
#330033 fulltraff-300
Tones
#3b0158 fulltraff-1200
Tones
#b280cc fulltraff-1000
Tones
#D1B2E0 fulltraff-500
Tones
#E8D8EF fulltraff-200
Background
#F6F0F9 fulltraff-100
Background
#FAF7FC Måltipset
Måltipset colors
Color Name Description Value maltipset
Topp, Ruta med siffra, Markera checkbox, Aktiva pilar, TV-ikon
#b5c6e2 maltipset-800
Header gradient
#a1afc8 maltipset-700
Markering i Toppswipe
#284163 maltipset-600
Actionbar
#324764 maltipset-500
Actionbar
#364d6e maltipset-400
System
#3e587d maltipset-300
Background
#0063b7 maltipset-200
Header Button
#cce0ff maltipset-100
Lagnamn i toppswipe
#4481e3 maltipset-950
Lagnamn i toppswipe
#111111 Momang - base colors
Momang base colors
Color Name Description Value momang
Gradient
linear-gradient(284.67deg, #9E29FF 0%, #6E14EB 100%) Oddset
Oddset colors
Color Name Description Value oddset
#e60000 oddset-header
#a00813 oddset-700
#570b04 oddset-600
#770F05 oddset-500
#8a1207 oddset-400
#9d1407 oddset-300
Header Button Active
#cc0000 oddset-grey-80
Overlay 80% alpha.
rgba(122, 122, 122, .8) oddset-200
Header Button
#ed242a Pay and play casino
Pay and play colors
Color Name Description Value pnp
#6E14EB pnp-100
#1E1E33 pnp-200
#5519B0 pnp-300
#8B43EF pnp-400
#9E29FF pnp-500
#A872F3 pnp-600
#C5A1F7 pnp-700
#E2D0FB pnp-800
#2A2A40 pnp-900
#FFA800 pnp-1000
#1CFFF3 Poker
Color Name Description Value poker-100
poker-100
#23585F poker-200
poker-200
#317A84 poker-300
poker-300
#47ADBB poker-400
poker-400
#4ED8E9 poker-500
poker-500
#CEF8FF poker-600
poker-600
#100F10 poker-700
poker-700
#FAA719 poker-800
poker-800
#3E3D3E poker-900
poker-900
#FFFFFF poker-gradient-light
poker-gradient-light
radial-gradient(51.1% 80.3% at 59.75% 55%, @poker-300 1.3%, @poker-100 100%) poker-gradient-dark
poker-gradient-dark
linear-gradient(90deg, @poker-600 0%, @poker-100 30%, @poker-100 70%, @poker-600 100%) Racing
Color Name Description Value racing
Primary color
#00a88b racing-100
Secondary color
#056353 racing-200
Background
#F7F9F9 racing-900
Complement to navy
#596D7F racing-300
Complement to background
#e3e4de racing-400
Widget header
#c7e9e3 racing-500
Coupon background
#004a3d Sportservice
Color Name Description Value sportservice
Header
#000000 sportservice-700
Platta i Matchhuvud.
#2d2d2e sportservice-400
Avdelarstreck.
#5e5e5e sportservice-300
Resultatram, Rubrik Team, Sekundär Typografi
#858585 sport-live
#4cacff sportservice-orange
#ff5500 Stryktipset
Stryktipset colors. Game and system colors.
Color Name Description Value stryktipset
Topp, Ruta med siffra, Markera checkbox, Aktiva pilar, TV-ikon
#00427a stryktipset-800
#e60000 stryktipset-700
Markering i Toppswipe
#052038 stryktipset-600
Actionbar
#273c4d stryktipset-500
Infobar, toppswipe
#072f52 stryktipset-400
System
#466c8b stryktipset-300
Background
#0063b7 stryktipset-200
Header Button
#0063b7 stryktipset-100
Lagnamn i toppswipe
#0073ff stryktipset-banner
Bakgrund för banners
#4F6CA9 Syndicate
Color Name Description Value syndicate-300
Bakgrund
#0073ff syndicate-200
Bakgrund
#0073ff syndicate-promo
Bakgrund, syndicate indikationsfärg
#00D773 syndicate
#000000 tips-sm
#0066a4 Topptipset
Topptipset colors
Color Name Description Value topptipset
Header, Ruta med siffra, Markerade checkbox, Aktiva pilar, TV-ikon, Lagnamn i toppswipe
#f29400 topptipset-700
Actionbar
#593700 topptipset-600
Markering i toppswipe
#663300 topptipset-500
Toppswipe
#8c4600 topptipset-400
System
#a16300 topptipset-300
Infobar
#bf6000 topptipset-200
Background
#d98e16 topptipset-100
Header Button
#ffa826
tur
Andra chansen
Color Name Description Value andra-chansen
Brand
#003800 andra-chansen-gold
Gold
#A58A31 Tur - Base colors
TUR Base colors
Color Name Description Value tur
#00d773 tur-100
#eafbe5 tur-200
#e7f6d0 Eurojackpot
Color Name Description Value eurojackpot
Brand
#A83001 eurojackpot-100
Dark
#6F0900 eurojackpot-200
Light
#E15702 eurojackpot-300
Gradient
linear-gradient(180deg, #A83001 0%, #FF4F0A 50%, #FFCDAB 100%) eurojackpot-400
Orange
#FF4F0A eurojackpot-500
Lighter
#FFCDAB eurojackpot-600
Yellow
#FFED00 Fler-lotter
Color Name Description Value fler-lotter
Primary color
#7800FF fler-lotter-100
Secondary color
#B12BFF fler-lotter-200
Highlight
#F7F9A8 Game packages
Color Name Description Value game-packages
Röd
#b50f0f game-packages-100
Mörkröd
#7f0000 Joker
Color Name Description Value joker
Brand
#b50f0f joker-100
Dark
#7f0000 joker-200
Light
#ed0000 Keno
Color Name Description Value keno
Brand
#ffdd00 keno-100
Dark
#ffc600 keno-200
Light
#ffee00 keno-300
Accent
#ed0000 KenoXpress
Color Name Description Value kenoxpress
Brand
#ffdd00 kenoxpress-100
Dark
#ffc600 kenoxpress-200
Light
#ffee00 kenoxpress-300
Accent
#ed0000 Lotto
Color Name Description Value lotto
Brand
#005400 lotto-100
Dark
#003800 lotto-200
Light
#108a0b lotto-300
Accent
#55ff33 Skrapspel
Color Name Description Value skrapspel-skrapkryss
Bakgrund till hela spelet
#DD6B10 skrapspel-skrapkryss-100
Komplementfärg
#E8C6AB skrapspel-skrapmatcha
Bakgrund till hela spelet
#DEADD0 skrapspel-skrapbingo
Bakgrund till hela spelet
#ABD8E8 skrapspel-skrapkeno
Bakgrund till hela spelet
#fcd124 skrapspel-skrap7an
Bakgrund till hela spelet
#00AB96 skrapspel-secondary
Header
#3C3C3B Småspel
Color Name Description Value smaspel-17ellermer
Base
#b31472 smaspel-3irad
Base
#377b8f smaspel-mittemellan
Base
#b91212 Supportern
Color Name Description Value supportern
Brand
#001932 supportern-200
Brand
#0D3A62 Triss
Color Name Description Value triss
Header, Knapp: Skrapa triss
#ffed00 triss-500
Ram runt lott mot gul background
#d0a026 triss-300
Klöver Start, BG Knappar Start
#ffba00 triss-200
Background
#ffd118 triss-100
Header Button
#fff34c Vikinglotto
Color Name Description Value vikinglotto
Brand
#0000ff vikinglotto-100
Dark
#000099 vikinglotto-200
Light
#6161ff vikinglotto-300
Accent
#e5007f
