# Cyber Monday-grafikk: et uttrykk for nettsalget

[Canonical HTML page](https://gradiently.design/nb/guide/cyber-monday-graphics)

Cyber Monday skjer nesten bare på skjermer, i innbokser og på betalingssider. Grafikken har en annen oppgave enn på Black Friday og fortjener sitt eget, kjøligere uttrykk.

## The short version

- Cyber Monday-grafikk fungerer best med en kjølig, digital palett som er tydelig beslektet med Black Friday-uttrykket, men synlig annerledes.
- Fordi Cyber Monday er et nettsalg, betyr nettbanneret og e-posttoppen like mye som de sosiale innleggene.
- Hver Cyber Monday-grafikk bør føre til én handling, vanligvis en lenke, og si tydelig når tilbudet slutter.
- Et smalt nettbanner trenger én kort linje fordi folk ser det i under ett sekund på vei til noe annet.
- Elektrisk blått, cyan og fiolett på nesten svart bunn virker digitalt uten kretsmønstre eller glitch-effekter.

God **Cyber Monday-grafikk** virker tydelig digital og peker videre: en kjølig, elektrisk palett på mørk bunn, én kort linje og en lenke. Cyber Monday er nettsalget, så arbeidet handler om mer enn sosiale innlegg. Det er banneret på nettsiden, toppen i e-posten som kommer om morgenen, og lenkeforhåndsvisningen folk ser når de deler. Lag alle fra ett uttrykk, så oppleves dagen som en hendelse fremfor en gjentakelse av fredag.

## Hvordan Cyber Monday skiller seg fra Black Friday

Black Friday startet som en butikkdag, og det visuelle låner fortsatt fra butikkvinduer: varme farger og store skilt. Cyber Monday fikk navn etter netthandel, og det meste av grafikken sees på telefonen et sekund før noen trykker. Det endrer tre ting.

### Black Friday

- Varme bunner, gull og glør
- Bygget rundt kunngjøringen
- Innlegg i strømmen og storyer leder
- Kan vare i flere dager

### Cyber Monday

- Kjølige bunner, elektrisk blått og cyan
- Bygget rundt klikket
- E-post, nettbanner og lenkeforhåndsvisninger leder
- Vanligvis én dag, så hastverket er ekte

Hvis du kjørte en Black Friday-serie, beholder du skriften, layouten og stemmen, men endrer temperaturen. Folk bør kjenne deg igjen med én gang og likevel se at noe nytt har startet. [Black Friday-innlegg i sosiale medier](https://gradiently.design/nb/guide/black-friday-post-ideas) setter opp den første halvdelen.

## Cyber Monday-farger og paletter

Digitalt trenger ikke kretskort, glitch-effekter eller binærkode i bakgrunnen. Farge gjør det alene. Lys som ser ut til å komme fra en skjerm, i blått, cyan eller fiolett mot en dyp blekkbunn, oppleves straks som nettbasert. Behold én aksent og la resten være mørkt.

- Skjermblått: `radial-gradient(circle at 70% 25%, #38bdf8 0%, #0c4a6e 38%, #050b14 78%)`
- Cyanglød: `radial-gradient(circle at 25% 70%, #22d3ee 0%, #164e63 40%, #04101a 80%)`
- Indigo til cyan: `linear-gradient(135deg, #0b1026 0%, #3730a3 50%, #22d3ee 100%)`
- Elektrisk fiolett: `radial-gradient(circle at 80% 80%, #a855f7 0%, #3b0764 40%, #0a0614 80%)`

Fire Cyber Monday-bunner. Hver kombinerer en nesten svart base med én farge av skjermlys.

- Blekk: #050b14
- Dypblått: #0c4a6e
- Skjermblått: #38bdf8
- Istekst: #e0f2fe
- Fredagsgull: #d4a24c

En palett som følger opp Black Friday: gullaksenten beholdes i små mengder mens bunnen blir blå.

Neon ser spennende ut på en mørk telefon og fryktelig når fargene vibrerer mot hverandre. [Neongradienter](https://gradiently.design/nb/guide/neon-gradients) viser hvordan du holder klare farger rene, og [cyberpunk-paletter](https://gradiently.design/nb/guide/cyberpunk-colors) går videre hvis merkevaren tåler det.

## Cyber Monday-banner til nettsiden

Et nettbanner leses på vei til noe annet, så det får én kort linje og en frist. Den tynne stripen over navigasjonen er minst påtrengende og fungerer på alle sider. Her er en i ren CSS, med en reservefarge dersom gradienten ikke lastes, og tekst som forblir lys overalt.

```html
<div class="cm-banner" role="region" aria-label="Cyber Monday sale">
  <a href="/sale">Cyber Monday: 25% off everything, today only</a>
</div>

<style>
  .cm-banner {
    background-color: #050b14;
    background-image: linear-gradient(90deg, #050b14 0%, #0c4a6e 50%, #050b14 100%);
    text-align: center;
    padding: 10px 16px;
  }
  .cm-banner a {
    color: #e0f2fe;
    font: 600 15px/1.4 system-ui, sans-serif;
    text-decoration: none;
  }
</style>
```

En smal kunngjøringsstripe. Den mørkeste fargen ligger i begge ender og lyset bare i midten, så den lyse teksten beholder kontrasten.

For et helt toppfelt fremfor en stripe designer du på 1920×1080 og holder ordene i venstre eller midtre tredel, der de tåler beskjæring på mindre skjermer. [Bakgrunner til nettsidens toppfelt](https://gradiently.design/nb/guide/website-hero-background) dekker størrelse og ytelse.

## Cyber Monday-e-postdesign

For mange butikker er Cyber Monday-e-posten dagens viktigste grafikk. Toppbildet er 1200×600, og på telefon viser det første skjermbildet ofte lite mer enn dette. Tilbudet hører derfor hjemme i øvre halvdel. Behold ordene som ekte tekst i e-posten der du kan, og bruk toppbildet til stemning og overskrift.

Et bredt Cyber Monday-toppbilde til e-post med blå gradient og teksten Bare i dag, 25% rabatt

Et e-posttoppbilde på 1200×600: tilbudet i øvre halvdel, der alle innbokser viser det.

- Emnefelt og toppbilde bør si det samme med de samme ordene.
- Sett én knapp under toppbildet, ikke fem.
- Skriv fristen med tidssone, særlig hvis du selger utenlands.
- Kontroller toppbildet i mørk modus, der noen innbokser endrer fargene rundt det.

[Design av e-posttoppbilder](https://gradiently.design/nb/guide/email-header-design) har mer om størrelser og særegenheter i mørk modus.

## Cyber Monday-innlegg og storyer

I sosiale medier er Cyber Monday kort, så to eller tre innlegg holder: en morgenlansering, en storypåminnelse midt på dagen og en siste oppfordring om kvelden. Hvert bør sende folk til lenken. La derfor det være plass til lenkemerket i storyer.

Et stående Cyber Monday-salgsinnlegg med elektrisk blå gradient og tilbudet i stor skrift

Morgeninnlegget: anledning, tilbud og frist.

En stående story som teller ned de siste seks timene av et Cyber Monday-salg

Kveldsstoryen, med plass under til lenkemerket.

| Grafikk | Størrelse | Merknad |
| --- | --- | --- |
| Instagram-innlegg | 1080×1350 | Morgenlansering |
| Story | 1080×1920 | Påminnelser med lenkemerke |
| E-posttoppbilde | 1200×600 | Tilbud i øvre halvdel |
| Nettsidens toppfelt | 1920×1080 | Ord i midtre tredel |
| Lenkeforhåndsvisning | 1200×630 | Vises når salgssiden deles |

Alt et nettsalg på én dag trenger, i ett uttrykk.

Lag alt dette uken før, ikke mandag morgen. På selve dagen vil du følge bestillingene og svare på meldinger. Den eneste designendringen som gjenstår, bør være å bytte «Seks timer igjen» med «Én time igjen» på siste story.

> **Ta det ned i tide** Når salget slutter, fjerner du banneret, bytter lenkeforhåndsvisningen tilbake og arkiverer storyene. Et Cyber Monday-banner som fortsatt vises onsdag, får fristen til å virke oppdiktet. Neste års frist blir litt mindre troverdig.

Lenkeforhåndsvisningen er den folk glemmer. Når noen deler salgssiden, er det dette bildet vennene ser. Sett det derfor for dagen. [Open Graph-bildestørrelse](https://gradiently.design/nb/guide/open-graph-image-size) viser hvordan. Med Pro endrer Gradiently ett ferdig design til alle disse formatene i ett steg, og bakgrunnen holder det roligste området bak ordene i hver størrelse.

## FAQ

### Når er Cyber Monday?

Cyber Monday er mandagen etter amerikansk Thanksgiving og følger derfor alltid Black Friday-helgen. Mange butikker kjører ett tilbud fra fredag til mandag og endrer uttrykket siste dag.

### Hvilke farger passer Cyber Monday-grafikk?

Kjølige skjermfarger som elektrisk blått, cyan og fiolett på nesten svart bunn virker digitale og skiller dagen fra Black Friday.

### Hvilken størrelse har et Cyber Monday-toppbilde til e-post?

1200×600 piksler er en pålitelig størrelse. Hold tilbudet i øvre halvdel, fordi det er delen folk ser først på telefon.

### Bør Cyber Monday-grafikk passe Black Friday?

Behold samme skrift, layout og stemme så folk kjenner deg igjen, og endre fargetemperaturen så den nye dagen føles ny.

### Hva bør et Cyber Monday-nettbanner si?

Én kort linje med tilbudet og fristen, lenket til salgssiden. Folk kaster et blikk på et banner fremfor å lese det grundig.