Gradienter
Hvordan gradienter fungerer, alle typene, og hvordan du lager noen som ser dyre ut.
200 guider · 11 emner
GradienterHva er en gradient? En enkel guide til fargeoverganger
6 min lesetid
En gradient er den enkleste ideen i fargeverdenen og en av de letteste å gjøre feil. Her er hva den er, hvordan den bygges, og hvorfor den kom tilbake på skjermer overalt.
GradienterTyper gradienter: lineær, radial, konisk og mesh forklart
5 min lesetid
Hver gradient flytter farge langs en bane. Endre banen, og du endrer følelsen. Her er hver type, hvordan den ser ut, koden for den og jobben den gjør best.
GradienterMesh-gradienter: hva de er og hvordan du lager en
5 min lesetid
Mesh-gradienter er de myke, drivende fargeflatene bak halvparten av lanseringssidene du har sett i år. Her ser du hvordan de fungerer, hvordan du bygger en for hånd, og de to feilene som ødelegger de fleste.
GradienterSlik lager du en gradientbakgrunn som ikke ser generisk ut
5 min lesetid
De fleste gradientbakgrunner ligner hverandre fordi de starter fra de samme få forhåndsinnstillingene. Her er en metode i fem steg for å lage en som ser gjennomtenkt ut, med koder du kan kopiere.
GradienterKornete gradienter: hvorfor litt støy får farge til å se påkostet ut
5 min lesetid
En ren gradient ser ut som en skjermstandard. Den samme gradienten med et fint lag korn ser ut som et trykk, et stillbilde fra en film eller en malt vegg. Her er hvorfor, hvor mye du bør legge til, og hvordan.
GradienterNordlysgradienter: mykt lys, gjort riktig
5 min lesetid
Nordlysgradienter låner utseendet til nordlyset: lysende slør av farge som driver over mørket. De er vakre, og de tipper raskt over i skjermsparer-land. Her er hvordan du holder dem på riktig side.
GradienterHvorfor gradienten din har striper, og hvordan du fikser banding
5 min lesetid
Du laget en jevn gradient, og den kom tilbake med striper. Det er banding, og det har en enkel årsak og en håndfull pålitelige løsninger. Her er regnestykket, og så kurene.
GradienterHvorfor noen gradienter blir grå i midten, og hvordan du stopper det
5 min lesetid
Blått og gult burde gi en nydelig gradient. Blander du dem på standardmåten, får du en grå flekk i midten. Her er nøyaktig hvorfor, og fire måter å holde hver overgang ren på.
Gradienter60 fargekombinasjoner for gradienter som fungerer, med koder
5 min lesetid
Seksti gradienter, sortert etter følelsen du vil ha og ikke etter fargetone. Hver av dem er en levende CSS-kode du kan kopiere, og hver gruppe forklarer regelen som får overgangene til å fungere.
GradienterTofargede gradienter: 30 par som alltid fungerer
5 min lesetid
To farger, én retning, ingenting som kan gå galt. Nesten. Her er de to reglene som avgjør om et par fungerer, og tretti par som består begge, klare til å kopieres.
GradienterMørke gradientbakgrunner: dybde uten et dystert uttrykk
5 min lesetid
Mørke gradienter kan se ut som en eksklusiv nattscene eller en grumsete skjerm med lav lysstyrke. Forskjellen ligger i noen få valg som er enkle å ta i bruk.
GradienterPastellgradienter som holder seg friske, ikke søtladne
4 min lesetid
Pasteller er de gradientene som er lettest å like og lettest å overdrive. Noen få regler gjør at de føles som vårlys på papir og ikke som en bursdagskake.
GradienterNeongradienter: glød uten slitne øyne
5 min lesetid
Neon er farge skrudd helt opp. På en mørk bunn gløder den, og spredt over en hel skjerm summer den. Slik beholder du gløden og blir kvitt summingen.
GradienterHolografiske gradienter og iriserende farger forklart
5 min lesetid
Holografisk folie, såpebobler og perlemor skifter alle farge når du beveger deg. En flat skjerm kan ikke det, men en godt bygget gradient kan overbevise øyet om at den gjør det.
GradienterDuotone-effekt: gi alle bilder merkevarens to farger
4 min lesetid
Duotone gjør alle bilder om til to valgfrie farger: én til skyggene, én til lyset. Det er den raskeste måten å få ulike bilder til å se ut som én merkevare.
GradienterGradient eller flat farge? Når hver av dem vinner
5 min lesetid
Flat farge er tydelig, billig og nøyaktig. Gradienter er levende, særpregede og vanskeligere å styre. De fleste gode merkevarer bruker begge. Slik avgjør du hvilken hver flate trenger.
GradienterGradienttekstur: korn, papir, glass og silke forklart
5 min lesetid
To gradienter med identiske farger kan føles som et stillbilde fra en film, et kort i boktrykk, en telefonskjerm eller en aftenkjole. Forskjellen er tekstur, og den sier mer enn fargene gjør.
GradienterGlassmorphism og gradienter: en praktisk guide
5 min lesetid
Frostet glass over en glødende gradient er en av de vakreste effektene i grensesnittdesign, og en av de letteste å gjøre uleselig. Slik får du skjønnheten og beholder ordene.
GradienterGradient map: farg om hva som helst på sekunder
5 min lesetid
Et gradient map tar et hvilket som helst bilde, foto, tekstur eller illustrasjon, og maler det om i fargene du velger, mens alt lys og all skygge beholdes. Det er det raskeste verktøyet for omfarging som finnes.
GradienterGradientvinkel og retning: hvilken vei bør en gradient gå
5 min lesetid
De samme to fargene kan føles rolige, oppløftende eller urolige, bare avhengig av hvilken vei de går. Slik velger du retning med vilje, og slik får du vinkelen helt riktig i koden.
GradienterNi feil i gradientdesign som får arbeidet til å se billig ut
5 min lesetid
De fleste gradienter som ser billige ut, svikter på én av ni forutsigbare måter. Her er hver feil, hva som forårsaker den, og den konkrete endringen som løser den.
GradienterRadiale gradienter: rampelyset som leder blikket
5 min lesetid
En radial gradient er det nærmeste design kommer å rette et lys mot noe. Slik sikter du den inn, gir den riktig størrelse og unngår at den ser ut som en blink.
GradienterKoniske gradienter: fargehjul, diagrammer og glans
4 min lesetid
Lineære gradienter beveger seg, radielle gradienter sprer seg, og koniske gradienter dreier. Den ene forskjellen gjør dem til det riktige verktøyet for hjul, diagrammer, metall og lysstråler.
GradienterTrykke gradienter uten striper eller grums
6 min lesetid
En gradient som gløder på skjermen, kan komme tilbake fra trykkeriet flat, stripete eller brun. Nesten alle disse feilene er forutsigbare, og de fleste kan rettes før filen forlater skrivebordet ditt.