Abstrakte baggrunde: former, flader og flow

En abstrakt baggrund er lavet af farve, form og tekstur frem for et genkendeligt motiv. Næsten alle hører til en af tre familier: geometriske baggrunde bygget af hårde kanter, striber og mønstre, flydende baggrunde bygget af bløde overgange og strømmende flader, og teksturerede baggrunde bygget af korn, støj og materiale. Vælg den familie, der passer til den følelse, du har brug for, og hold et roligt område frit dér, hvor ordene skal stå.

Denne guide gennemgår hver familie med levende eksempler og koder, hvornår du bruger hvilken, og hvordan du forhindrer en abstrakt baggrund i at overdøve indholdet. Om de gradienttyper, der ligger under mange af dem, kan du læse i typer af gradienter.

Tre slags abstrakte baggrunde

Geometriske abstrakte baggrunde

Geometriske baggrunde bruger skarpe kanter: delinger, striber, ringe, kiler og gitre. De virker bevidste og strukturerede og passer naturligt sammen med kraftige typografiske layouts som den schweiziske stil. I CSS skaber hårde farvestop (to farver på samme position) kanterne.

Tricket med geometriske baggrunde er tonen. Striber eller ruder med høj kontrast vibrerer og gør tekst ovenpå næsten umulig at læse. Hold mønsterfarverne tæt på hinanden i lysstyrke, som de tonale striber og ringe ovenfor, og gem den høje kontrast til områder uden ord. CSS-mønstre har mange flere.

Flydende abstrakte baggrunde

Flydende baggrunde har slet ingen kanter: farven samler sig, driver og folder sig som lys på vand eller silke. Det omfatter mesh-gradienter, nordlysglød og strømmende bånd. De virker roligere og mere eksklusive end geometriske baggrunde, og de er de nemmeste abstrakte baggrunde at lægge tekst på, fordi en blød flade har store, jævne områder.

.fluid {
  background-color: #2b1055;
  background-image:
    radial-gradient(40% 50% at 20% 30%, #ff7a59cc, transparent 70%),
    radial-gradient(45% 55% at 80% 25%, #c43d7acc, transparent 70%),
    radial-gradient(50% 60% at 60% 85%, #5b3cc4cc, transparent 70%);
}

Flydende baggrunde findes i navngivne stilarter: mesh-gradienter blander flere farvepunkter hen over en flade, og aurora-gradienter lader lysende pletter svæve på en mørk bund. Begge ser bedst ud med lidt korn ovenpå.

Teksturerede abstrakte baggrunde

Tekstur gør flad farve til en overflade, du næsten kan mærke. Fint korn læses som film, en grovere struktur som papir, bløde fibre som stof og en mat sløring som glas. Teksturen kan være hele baggrunden, som en papirfarvet flade, eller et lag over en gradient, og sådan laves de fleste baggrunde, der ser eksklusive ud.

Hold teksturen diskret, når der ligger tekst ovenpå: nok til at mærkes på nært hold, men ikke så meget, at bogstaverne ser snavsede ud. Baggrundstekstur gennemgår korn, papir, stof og glas i detaljer, og kornede gradienter forklarer, hvorfor lidt støj får farver til at se dyre ud.

Sådan laver du en abstrakt baggrund af dine brandfarver

De bedste abstrakte baggrunde ser abstrakte ud, men tilhører nogen. Det sker, når du tager udgangspunkt i dine egne farver og former frem for en stockpakke.

1. 1

   Tag to eller tre brandfarver

   Tilføj en dybere tone fra samme familie for dybde. Sådan vælger du brandfarver hjælper, hvis du ikke har dem endnu.

2. 2

   Vælg en familie

   Geometrisk, hvis dit brand er præcist eller energisk, flydende, hvis det er roligt eller eksklusivt, og tekstureret, hvis det er håndlavet eller varmt.

3. 3

   Lån en form fra brandet

   En kurve fra logoet, vinklen på et bogstav, en cirkel fra et ikon. Når du gentager den i baggrunden, binder det de to sammen.

4. 4

   Planlæg den stille zone

   Beslut, hvor teksten skal stå i hvert format, og hold området jævnt i lysstyrke.

5. 5

   Tilføj tekstur til sidst

   Et let korn over det hele, og tjek det så i telefonstørrelse med rigtige ord ovenpå.

Sådan vælger du en abstrakt baggrund til opgaven

Afstem abstraktionen efter indholdet. Et slide fyldt med data kræver en stille flydende eller tonal flade. Et lanceringsopslag kan tåle en dristig geometrisk deling. En menu eller et håndværksprodukt vil have tekstur. Og uanset hvad du vælger, så test det i den rigtige størrelse med de rigtige ord ovenpå, for abstrakte baggrunde, der er smukke tomme, kæmper ofte mod teksten, når den kommer.

Marks fra Gradiently er flydende og teksturerede abstraktioner i ét: farver, op til tre stablede materialer, lys, korn og bevægelse, tegnet live bag dit design med deres roligste område flyttet om bag ordene. Du kan finde dem på Markedet eller lave en i Forge.