# Farger

Fargepaletten vår består av 4 primærfarger (inkludert hvit) og 3 sekundærfarger. Hver farge har 2 nyanser i lysere rettning og 2 nyanser i mørkere rettning.&#x20;

I vår logo brukes fargene "Blå" for symbolet" og "Marine" for selskapsnavnet.

**Primærfarger** \
Buypass sine mest gjenkjennelige farger er kombinasjonen marineblå, blå og hvit. &#x20;

![Pantone 2174 U | CMYK 92 47 0 0 | RGB 40 113 235 | HEX #2871eb](/files/-LLEScmdfT8Iy8DCsYEF)

![Pantone 2757 U | CMYK 97 82 3 19 | RGB 26 57 124 | HEX #1a397c](/files/-LLESjKz_70lc0xXbSCe)

![Pantone 649 U | CMYK 12 4 2 0 | RGB 237 241 248 | HEX #edf1f8](/files/-LLESqV5AD7A21BbMNv_)

**Sekundærfarger** \
Disse fargene brukes i mindre kvanta – i tilfeller der man har behov for å tilføre variasjon eller der man har behov for å poengtere noe spesielt. F.eks. magenta for å signalisere ‘fare’.&#x20;

![Pantone 7635 U | CMYK 0 81 23 4 | RGB 234 109 140 | HEX #ea6d8c](/files/-LLESxeo6xMia808JLFb)

![Pantone 324 U | CMYK 30 0 16 0 | RGB 45 203 195 | HEX #2dcbc3](/files/-LLET2r5K0JdaoBRKUEX)

![Pantone 2757 U | CMYK 6 15 20 1 | RGB 240 217 196 | HEX #f0d9c4](/files/-LLET8eINcqmeEBm7eR8)

**Kontrastkrav** \
Den visuelle presentasjonen av tekst og bilder skal et kontrastforhold på minst 4.5:1, unntatt i tilfeller med større tekst (18pt og større eller 14pt ved medium/ fet vekt) der kravet er 3:1. Uvesentlig tekst og logoer rammes ikke av kontrakstkrav.

### **Andre valører**&#x20;

De ulike fargene kommer i flere valører for økt fleksibilitet. Spesielt i skjermbasert design kan det melde seg behov for flere farger, og ofte kun med ørsmåforskjeller. F.eks. ved en knapp som endrer tilstand ved mouseover/hover. Da kan man benytte fargenes tilleggsvalører som vist her.

#### Snø (Snow)

![](/files/-LKQV04-6p3JdThTz48D)

| **Valører**           | **Kode**                                      |
| --------------------- | --------------------------------------------- |
| **Snow, lighter 50**  |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-snow-lighter-50</p><p>#f9fafd</p> |
| **Snow, lighter 25**  |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-snow-lighter-25</p><p>#f7f9fc</p> |
| **Snow 100**          |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-snow</p><p>#edf1f8</p>            |
| **Snow, darker 25**   |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-snow-darker-25</p><p>#e6e9ef</p>  |
| **Snow, darker 50**   |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-snow-darker-50</p><p>#d7dae1</p>  |
| **Snow, darker 75**   |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-snow-darker-75</p><p>#c4c7d0</p>  |

#### Blå (Blue)

![](/files/-LL4ie2QRyD_zpCAKGB3)

| **Valører**           |                                                 |
| --------------------- | ----------------------------------------------- |
| **Blue, lighter 50**  |                                                 |
| <p>Sass</p><p>Hex</p> | <p>$buypass-blue-lighter-50</p><p>#5b94ff</p>   |
| **Blue, lighter 25**  |                                                 |
| <p>Sass</p><p>Hex</p> | <p>$buypass-blue-lighter-25</p><p>#367cff</p>   |
| **Blue**              |                                                 |
| <p>Sass</p><p>Hex</p> | <p>$buypass-blue</p><p>#2871eb</p>              |
| **Blue, darker 25**   |                                                 |
| <p>Sass</p><p>Hex</p> | <p>$buypass-blue-darker-25</p><p>Hex#1c61d3</p> |
| **Blue, darker 50**   |                                                 |
| <p>Sass</p><p>Hex</p> | <p>$buypass-blue-darker-50</p><p>#1959c5</p>    |

#### Marine (Navy)

![](/files/-LM6bQU6UgDr-Cqr0Wuy)

| Valører               |                                               |
| --------------------- | --------------------------------------------- |
| **Navy, lighter 50**  |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-navy-lighter-50</p><p>#8491b0</p> |
| **Navy, lighter 25**  |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-navy-lighter-25</p><p>#64759c</p> |
| **Navy**              |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-navy</p><p>#1a397c</p>            |
| **Navy, darker 25**   |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-navy-darker-25</p><p>#142e68</p>  |
| **Navy, darker 50**   |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-navy-darker-50</p><p>#0d2250</p>  |

#### Sjøgrønn (Teal)

![](/files/-LM6cAF8W1cF5BPZjKVq)

| Valører               | Kode                                          |
| --------------------- | --------------------------------------------- |
| **Teal, lighter 50**  |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-teal-lighter-50</p><p>#a4e9e5</p> |
| **Teal. lighter 25**  |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-teal-lighter-25</p><p>#79ded9</p> |
| **Teal**              |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-teal</p><p>#2dcbc3</p>            |
| **Teal, darker, 25**  | <p>$buypass-teal-darker-25</p><p>#35b7b0</p>  |
| <p>Sass</p><p>Hex</p> | <p>$buypass-teal-darker-25</p><p>#35b7b0</p>  |
| **Teal, darker 50**   |                                               |
| <p>Sass</p><p>Hex</p> | <p>$buypass-teal-darker-50</p><p>#2da9a2</p>  |

#### Magnenta

![](/files/-LM6d44_U743hGvMb2r-)

| Valører                 | Kode                                             |
| ----------------------- | ------------------------------------------------ |
| **Magenta, lighter 50** |                                                  |
| <p>Sass</p><p>Hex</p>   | <p>$buypass-magenta-lighter-50</p><p>#f2a6b9</p> |
| **Magenta, lighter 25** |                                                  |
| <p>Sass</p><p>Hex</p>   | <p>$buypass-magenta-lighter-25</p><p>#ef91a8</p> |
| **Magenta**             |                                                  |
| <p>Sass</p><p>Hex</p>   | <p>$buypass-magenta</p><p>#ea6d8c</p>            |
| **Magenta, darker 25**  |                                                  |
| <p>Sass</p><p>Hex</p>   | <p>$buypass-magenta-darker-25</p><p>#d25a78</p>  |
| **Magenta, darker 50**  |                                                  |
| <p>Sass</p><p>Hex</p>   | <p>$buypass-magenta-darker-50</p><p>#ba4c68</p>  |

#### Sand

![](/files/-LM6dfuH5UlKDTWjTtTI)

| Valører               | Kode                                                |
| --------------------- | --------------------------------------------------- |
| **Sand, ligther 50**  |                                                     |
| <p>Sass</p><p>Hex</p> | <p>$buypass-sand-lighter-50</p><p>#fbf3ec</p>       |
| **Sand, ligther 25**  |                                                     |
| <p>Sass</p><p>Hex</p> | <p>$buypass-sand-lighter-25</p><p>#f7e9dd</p>       |
| **Sand**              |                                                     |
| <p>Sass</p><p>Hex</p> | <p>$buypass-sand</p><p>#f0d9c4</p>                  |
| **Sand, darker 25**   |                                                     |
| <p>Sass</p><p>Hex</p> | <p></p><p>$buypass-sand-darker-25</p><p>#e1ccb8</p> |
| **Sand, darker 50**   |                                                     |
| <p>Sass</p><p>Hex</p> | <p>$buypass-sand-darker-50</p><p>#d5c0ac</p>        |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://buypass-profilguide.gitbook.io/project/farger.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
