Lavendelgradient: mjuka lila koder

En lavendelgradient blandar bleka, milt blåaktiga lila, oftast från nästan vitt till en len syrén eller blåklocka. Den känns lugn, lätt och lite drömsk, vilket är varför varumärken inom välmående, sömn, skönhet och bröllop älskar den. Två saker går fel med den: tar du bort för mycket färg blir den dammigt grå, och lägger du till för mycket rosa blir den sockersöt. Behåll en färgpunkt tydligt färgad, para den med en varm eller grön partner och sätt dina ord i djupt plommon.

Lavendel, syren, blåklocka och malva

Mjuka lila har flera namn, och vart och ett lutar åt sitt håll. Att veta vilket du vill ha gör blandningen lättare: lavendel och blåklocka lutar åt blått, syren och malva lutar åt rosa.

Bleka lavendelgradienter

Det här är de stilla, närmast vitt, för bakgrunder som bär mycket text: menyer till ett tehus, ett nyhetsbrev, en apps välkomstskärmar. De är knappt där, så använd dem där innehållet är poängen.

Gradienter i syren och blåklocka

Ett steg djupare blir lavendel en tydlig färg snarare än en nyans. Syren till blåklocka ger en sval, modern blandning som ser bra ut på mobilskärmar. Syren till orkidé är varmare och mer romantisk. Håll båda ändarna på liknande ljushet så förblir övergången mjuk.

Lavendel med persika, smör eller salvia

Ensam kan lavendel kännas för söt. En partner utanför den lila familjen löser det. Persika och smör ger värme och får lavendel att kännas som ljuset en tidig kväll. Salvia tillför något vuxet och botaniskt, vilket är varför lavendel och salvia är ett så populärt bröllopspar. I de här bleka nyanserna blandas motsatta färger utan att bli leriga, eftersom det finns lite mättnad att förlora. Pastellgradienter tar upp den principen över hela färghjulet.

Dova lavendelgradienter

Låter du lavendel gå ner mot violett eller plommon får du skymning: fortfarande mjuk överst, rik nederst. De fungerar för sömnappar, ljusvarumärken, kvällsyoga, parfym och bokhandlar. Den djupa änden ger också vit text en plats att vila på. För hela skalan av djärvare lila, se lila gradienter.

Idéer med lavendelgradient att publicera den här veckan

Lavendel väljs ofta för att den känns fin, och används sedan utan plan. Här är konkreta fall där den verkligen hjälper:

• En app för sömn eller meditation: ”Läggdags” som bakgrund för välkomstskärmarna, plommontext överst, knappen i det djupa violetta området.
• En blomsterbutiks inlägg inför mors dag i 1080×1350: ”Lavendel och persika” med en rad: ”Beställ senast torsdag.”
• En hudvårdslansering: ”Lavendeldimma” bakom produktfoton, så att förpackningen bär färgen.
• En terapeuts eller coachs LinkedIn-banner i 1584×396: ”Blåklockslavering” läses lugn och professionell utan kylan i företagsblått.
• En prislista för ett spa på en A4-affisch: ”Lavendel och salvia” med aubergintext, läsbar från andra sidan receptionen.

Undvik grå och sockersöt lavendel

En användbar kontroll: lägg en ren grå provbit bredvid din lavendel. Om du har svårt att se skillnad med en blick, skruva upp färgen ett snäpp. Kontrollera också på en mobil med låg ljusstyrka, där mycket bleka nyanser lätt går förlorade.

Text på en lavendelgradient

Lavendel är mycket ljus, så vit text fungerar inte på nästan någon del av den: vitt på syren #c4b5fd mäter under 2 till 1. Djupt plommon #2e1065 på samma syren mäter över 8 till 1, och det håller texten inom den lila familjen i stället för svartets skärpa. För ett mjukare uttryck på de blekaste lavendelnyanserna klarar en dämpad aubergine som #3b2f4a fortfarande kontrasten med råge. Färgkontrast och tillgänglighet har detaljerna.

Med Pro kan Gradiently föra den enda designen från tryck till varje storlek för sociala medier i ett steg: Marken renderas på nytt i varje format, och Auto-bläck väljer ljus eller mörk text per rad ur Markens egen palett. För mer om pappersvarorna, se färgpaletter för bröllop.

CSS för lavendelgradient

Som standard blandar webbläsare gradientfärger i sRGB, vilket kan dämpa mitten av en blandning mellan två nyanser. Att interpolera i OKLCH håller mittpunkten ren, och en hex-reserv täcker webbläsare utan stöd. Se CSS-gradienter i OKLCH för stöd.

.card-lavender {
  background: linear-gradient(135deg, #f5f3ff, #ddd6fe, #fde2cf);
  color: #2e1065;
}

@supports (background: linear-gradient(in oklch, red, blue)) {
  .card-lavender {
    background: linear-gradient(in oklch 135deg, #f5f3ff, #ddd6fe, #fde2cf);
  }
}