Kortversionen
- En sidengradient efterliknar draperat tyg med långa, mjuka veck, smala ljusa högdagrar på varje ås och djupa, färgade skuggor i varje dal.
- Sidens högdagrar är mycket smalare än dess skuggor, och den obalansen är det som läses som glans snarare än vanlig skuggning.
- Skiftande siden vävs av trådar i två färger, så den byter nyans mellan högdager och skugga, till exempel blågrönt i ljuset och violett i vecken.
- Sidens skuggor ska vara en djupare, mer mättad version av tygets färg, aldrig grå.
- Sidengradienter passar lyx, skönhet, smycken och bröllop eftersom själva materialet signalerar omsorg och kostnad.
På den här sidan
En sidengradient efterliknar draperat tyg: långa veck av färg, vart och ett med en smal, ljus högdager längs åsen och en mjuk, djup skugga i dalen. Det mönstret av tunt ljus och bred skugga är det ögat läser som glans. Det är en materialkänsla snarare än en färgkänsla, vilket är varför samma champagne eller smaragd kan kännas platt som en vanlig gradient och lyxig som siden. Du behöver tre saker: en tygfärg, en högdager som är ljusare och något varmare, och en skugga som är djupare och mer mättad.
Hur siden fångar ljus
Sidenfibrer är släta och något prismaformade, så de reflekterar ljus på ett fokuserat sätt. Ett veck i siden ger en snabb, skarp högdager där det vetter mot ljuset och en lång, mild övergång in i skuggan. Matt bomull i samma veck skulle ge en bred, matt gradient utan skarp topp. Kopiera de egenskaperna och vilken färg som helst börjar läsas som siden.
Hur det ser ut
I din gradient
I din gradient
Hur det ser ut
I din gradient
Hur det ser ut
I din gradient
Koder för sidengradienter
Var och en av dessa är en linjär gradient med veck inbyggda: ojämna band, skarpa högdagrar och breda skuggor. De fungerar som bakgrunder på egen hand, och som bas för den lagrade versionen längre ner.
Håll vinkeln mellan 100 och 125 grader så att vecken faller diagonalt, som tyg som hänger från ett hörn. Ett helt lodrätt veck ser ut som en gardin; ett vågrätt ser ut som ett band. Mörka sidentyper som midnatt och oxblod är mest förlåtande, eftersom skuggan döljer klumpiga skarvar. De passar naturligt ihop med guldtext, som i svart och guld som gradient.
Skiftande siden: två färger i ett tyg
Skiftande siden, även kallad changeant, vävs med en färg på trådarna på längden och en annan på tvären. När tyget vänds ser du mer av den ena eller andra, så det byter nyans mellan ljus och skugga. Det är den mest slående siden att efterlikna, och det krävs bara en förändring: använd en nyans för högdagrar och skuldror och en annan nyans för dalarna.
linear-gradient(115deg, #2e1065 0%, #14b8a6 19%, #ccfbf1 23%, #2dd4bf 28%, #6d28d9 40%, #2e1065 52%, #0f766e 64%, #99f6e4 68%, #5b21b6 78%, #1e0a45 100%)Så bygger du sidenveck i CSS
En enda linjär gradient ger parallella veck, vilket ser ut som plisserat tyg. Riktigt draperi kurvar. Lägg två gradienter i lager med något olika vinkel, en med mjukt ljus och en med vecken, och lägg till en stor radiell skugga så att ena sidan faller bort. Resultatet läses som tyg som hänger.
.silk {
min-height: 100vh;
background-color: #4a3216;
background-image:
radial-gradient(ellipse 70% 90% at 85% 100%, rgba(40, 24, 8, 0.65) 0%, transparent 70%),
linear-gradient(100deg, transparent 30%, rgba(255, 246, 225, 0.35) 38%, transparent 44%),
linear-gradient(115deg, #6b4f2a 0%, #c8a46a 18%, #f7ead0 23%, #b8925a 30%,
#5a3f1e 48%, #a8844f 62%, #efdcb6 66%, #8c6a3a 74%, #4a3216 100%);
}Siden jämfört med satin-, flytande och kromgradienter
Skugga
Känns som
Skugga
Känns som
Skugga
Känns som
Där sidengradienter fungerar bäst
Siden signalerar omsorg, vilket gör det rätt för smycken, parfym, hudvård, brud, hotell och premiumlanseringar. Para det med en förfinad serif eller en lätt, bred sans och håll orden få. Champagne och elfenben passar bröllop; smaragd, midnatt och oxblod passar afton och lyx. Lyxiga färgpaletter och färgpaletter för bröllop har fler kombinationer.
Ett parfyminlägg i 1080×1350, orden centrerade på en lugn skuldra av tyget.
En inbjudan i 5×7 tum på 1500×2100, elfenbenssiden med namnen i det lugnaste bandet.
Ser ut som plast
- Högdagrar lika breda som skuggorna
- Grå skuggor
- Perfekt parallella veck
- Inget korn, så det läses som en rendering
Ser ut som siden
- Smala, ljusa högdagrar
- Skuggor som fördjupar tygets färg
- Veck som korsas och kurvar
- Ett andetag av fint korn
Gradiently Marks staplar upp till tre material med eget ljus och korn, så en yta kan bära djup och glans utan att du bygger veck för hand. Var och en renderas i full kvalitet i varje storlek du designar i, från en inbjudan till en Story, och håller ytan bakom dina ord lugn. Bläddra på Marknaden med färgord som ”champagne” eller ”smaragd”.
Vanliga frågor
Hur gör jag en sidengradient?
Använd en linjär gradient med ojämna band: smala, nästan vita högdagrar, breda band av tygets färg och breda, djupare skuggor. Lägg en andra glans med något annan vinkel i lager för kurvat draperi.
Vilka färger ser bäst ut som siden?
Champagne, elfenben, smaragd, midnattsblått, rosa och oxblod läses bra eftersom de har en tydlig ljus och mörk version. Mycket bleka pasteller behöver extra skuggdjup.
Vad är skiftande siden?
Siden vävt med trådar i två färger, så det byter nyans när det rör sig. I en gradient använder du en nyans för högdagrarna och en annan för skuggorna.
Vad skiljer siden- och satingradienter?
Satin har bredare, glansigare högdagrar och kortare, skarpare skuggor. Siden har tunna, ljusa högdagrar och breda, rika skuggor, vilket läses som stillsammare.
Skriven av Gradiently
Teamet bakom Gradiently, ett designverktyg byggt kring Marks: levande gradienter som får allt du gör att kännas som ditt.
Se vår profil