# Hvad et brandkit skal indeholde, og hvordan du holder orden

[Canonical HTML page](https://gradiently.design/da/guide/brand-kit)

Stilguiden fortæller, hvad du skal gøre. Brandkittet er det, folk faktisk bruger. Med de rigtige filer, formater og mapper kan alle følge brandets stil uden at spørge.

## The short version

- Et brandkit er samlingen af brugsklare filer, som lader alle skabe materiale i brandets stil: logoer, farvekoder, skrifttyper, baggrunde, skabeloner, godkendte billeder og stilguiden.
- Logoer hører hjemme i kittet som SVG til skærme, gennemsigtig PNG til hverdagsværktøjer og ensfarvede versioner i sort og hvid.
- Farvekoder skal stå i alle de notationer, folk får brug for, som regel hex og RGB til skærme og CMYK til tryk.
- Baggrunde og skabeloner er de mest brugte og oftest glemte dele af et brandkit.
- Et brandkit forbliver ryddeligt, når det har ét hjem, én ansvarlig, tydelige filnavne og en arkivmappe til alt, der er taget ud af brug.

Et **brandkit** er samlingen af brugsklare filer, alle har brug for til at skabe noget i brandets stil: logofiler, farvekoder, skrifttyper, baggrunde, skabeloner, godkendte billeder og en kort stilguide. Hvor [brandstilguiden](https://gradiently.design/da/guide/brand-style-guide) forklarer reglerne, stiller kittet materialerne til rådighed. Et godt kit betyder, at en freelancer, en ny kollega eller en AI-assistent kan gå i gang på få minutter uden at stille dig et eneste spørgsmål.

## Tjekliste til dit brandkit

| Del | Det skal du tage med | Derfor er det vigtigt |
| --- | --- | --- |
| Logo | SVG, gennemsigtig PNG, ensfarvet sort og hvid, kvadratisk avatarversion | Hvert værktøj og hver baggrund kræver sin fil |
| Farver | Navne, hex-, RGB- og CMYK-koder med hver farves opgave | Forhindrer, at folk henter farver fra skærmbilleder |
| Skrifttyper | Skrifttypenavne med downloadlinks eller filer samt licensnoter | Undgår erstatninger, der ændrer hele udtrykket |
| Baggrunde | Signaturbaggrund i almindelige størrelser, CSS-kode, ensfarvet reserve | Fylder det største område i de fleste designs |
| Skabeloner | Dine mest almindelige opslag, stories, slides og mailbannere | Den hurtigste vej til et konsistent udtryk |
| Billedmateriale | Godkendte fotos, illustrationer eller ikonsæt | Forhindrer, at billeder fra billedbanker sniger sig ind |
| Stilguide | Reglerne på én side som PDF eller link | Forklarer, hvornår hver fil skal bruges |

Syv dele. De fleste kits har de første tre; de næste tre er dem, der faktisk skaber konsistens.

Tænk over, hvem der åbner kittet, og hvad hver person leder efter først:

- **En ansvarlig for sociale medier** vil have skabeloner og baggrunde i de rigtige størrelser
- **En webudvikler** vil have SVG-logoet, farvekoderne som CSS og kilderne til skrifttyperne
- **Et trykkeri** vil have tryklogoet, CMYK-værdier og eventuelle specialfarver
- **En ny kollega** vil have guiden på én side og ét godt eksempel på hvert format
- **En AI-assistent** vil have reglerne som ren tekst og farverne som koder

## Logofiler: de formater, du har brug for

Ét logo, flere filer. Hvert format løser et forskelligt problem, og det forkerte er som regel grunden til uskarpe logoer, hvide kasser eller forkerte farver.

| Format | Brug det til | Vær opmærksom på |
| --- | --- | --- |
| SVG | Websites, apps og alt, der skal skaleres | Nogle kontorværktøjer og værktøjer til sociale medier accepterer det ikke |
| PNG, gennemsigtig | Slides, dokumenter, værktøjer til sociale medier, mail | Eksportér stort, for eksempel 2,000 px bredt, så det forbliver skarpt |
| PDF eller EPS | Tryk, skilte og merchandise | Send til trykkerier, ikke til sociale medier |
| JPEG | Næsten aldrig til logoer | Ingen gennemsigtighed, så logoet kommer i en hvid kasse |

Som minimum: SVG og gennemsigtig PNG af hovedlogoet samt hvide og sorte ensfarvede versioner til fotos og gradienter.

Tag også en version med, der virker på din signaturbaggrund. Et logo, der forsvinder på din egen gradient, er et almindeligt problem, som kan undgås; [logo på en gradient](https://gradiently.design/da/guide/logo-on-gradient-background) forklarer løsningerne.

## Farver, skrifttyper og resten af grundlaget

- Natblå: #0e1424
- Mel: #f3e6d0
- Ovnglød: #e0823d
- Skorpe: #6b4a2f

Farver i et kit skal have navne såvel som koder. Folk husker »ovnglød«; ingen husker #e0823d.

```css
:root {
  --night-blue: #0e1424; /* rgb(14 20 36) grounds, 60% */
  --flour: #f3e6d0;      /* rgb(243 230 208) text and panels, 30% */
  --oven-glow: #e0823d;  /* rgb(224 130 61) accents only, 10% */
  --crust: #6b4a2f;      /* rgb(107 74 47) support */

  /* Signature background, with the flat fallback first */
  --ground: #0e1424;
  --ground-gradient: radial-gradient(90% 70% at 50% 110%, #e0823d 0%, #6b4a2f 25%, #1b2238 55%, #0e1424 100%);
}
```

Læg en farvefil i kittet til den, der bygger dit website. Det sparer en omgang gætværk ud fra skærmbilleder.

Notér, hvor hver skrifttype kommer fra, og hvad licensen tillader. Mange gode skrifttyper er gratis på [Google Fonts](https://fonts.google.com); kommercielle skrifttyper kræver ofte en licens pr. person eller pr. website, så skriv det ned. [Sådan vælger du brandskrifttyper](https://gradiently.design/da/guide/brand-fonts) hjælper med selve valget.

## Baggrunde og skabeloner: de filer, folk bruger mest

Logoer får opmærksomheden, men baggrunde og skabeloner bliver brugt. Klargør din signaturbaggrund i de størrelser, du oftest udgiver i, så ingen strækker et kvadratisk billede til et banner. Byg derefter skabeloner oven på den.

- Opslag 4:5: 1080 × 1350
- Story 9:16: 1080 × 1920
- Slide 16:9: 1920 × 1080
- Linkvisning: 1200 × 630
- Mailbanner: 1200 × 600
- LinkedIn-banner: 1584 × 396

Seks størrelser, der dækker de fleste små brands. Rendér baggrunden til hver form frem for at beskære ét billede.

## En mappestruktur til brandkittet, der holder orden

```text
brand-kit/
  00-read-me-first.pdf          (the one-page style guide)
  01-logo/
    cornerloaf-logo-primary.svg
    cornerloaf-logo-primary.png
    cornerloaf-logo-white.png
    cornerloaf-logo-black.png
    cornerloaf-avatar-square.png
    print/cornerloaf-logo-primary.pdf
  02-colour/
    colours.css
    colours.pdf                 (hex, RGB, CMYK, names, jobs)
  03-type/
    fonts.txt                   (names, links, licence notes)
  04-backgrounds/
    ground-1080x1350.png
    ground-1080x1920.png
    ground-1920x1080.png
  05-templates/
  06-imagery/
  _archive/                     (retired files, never deleted)
```

Nummererede mapper holder rækkefølgen, én læs mig-fil ligger øverst, og gamle filer flyttes til arkivet frem for at blive liggende ved siden af de nye.

### Rodet kit

- logo-endelig-v3-NY-brug-denne.png
- Fem kopier af kittet på forskellige drev
- Gamle og nye farver side om side
- Skrifttyper med navn, men uden link

### Ryddeligt kit

- brand-logo-hvid.png, navngivet efter hvad det er
- Ét hjem, som der linkes til alle andre steder
- Udfasede filer flyttet til _archive
- Hver skrifttype med kilde og licens

## Sådan holder du et brandkit opdateret

1. **Ét hjem, én ansvarlig** Behold én hovedkopi, og udpeg én person, der må ændre den. Alle andre linker til den frem for at downloade kopier.
2. **Navngiv filer efter, hvad de er** Brand, element, variant, format. Aldrig »endelig« eller »ny«: det passer ikke længere ugen efter.
3. **Arkivér frem for at slette** Flyt materiale til en arkivmappe, når det tages ud af brug. Gamle filer ved siden af nye er grunden til, at gamle farver vender tilbage.
4. **Gennemgå efter hver ændring** Ny skabelon, ny farve, ny logoopsætning: opdatér kittet samme dag og derefter stilguiden. Se [brandkonsistens](https://gradiently.design/da/guide/brand-consistency) for at forstå, hvorfor afvigelser starter her.

Gradiently har et brandkit i Studio, hvor dine logoer, farver og skrifttyper er ét klik fra hvert design, og Designer bruger det, når den skaber eller redigerer materiale. Hvis du driver flere brands, får hvert sit eget kit og sine egne Marks. [Opsætning af dit brandkit i Gradiently](https://gradiently.design/da/guide/brand-kit-setup) gennemgår det.

## FAQ

### Hvad er et brandkit?

Et brandkit er en samling brugsklare brandfiler: logoer, farvekoder, skrifttyper, baggrunde, skabeloner, godkendte billeder og en kort stilguide.

### Hvilke logofiler skal et brandkit indeholde?

En SVG og en gennemsigtig PNG af hovedlogoet, hvide og sorte ensfarvede versioner, en kvadratisk avatarversion og en PDF eller EPS til tryk.

### Hvad er forskellen på et brandkit og en stilguide?

Stilguiden er reglerne; brandkittet er filerne. Kittet bør indeholde guiden, og guiden bør fortælle, hvor kittet ligger.

### Hvordan deler jeg et brandkit med en freelancer?

Del et link til den ene hovedmappe med stilguiden øverst. Undgå at sende kopier, som bliver forældede.