# Viininpunainen liukuväri: syvät viini- ja punaruskeat sävyt

[Canonical HTML page](https://gradiently.design/fi/guide/maroon-gradient)

Viininpunainen on aikuistunutta punaista. Se muistuttaa viinistä, sametista ja vanhoista kirjastoista, mutta muuttuu huolimattomasti sekoitettuna ruskeaksi. Nämä koodit säilyvät täyteläisinä.

## The short version

- Viininpunainen liukuväri sekoittaa syviä purppuraan taittuvia punaisia, kuten #800020, #7f1d3a ja #4a0e1f, usein lähes mustaan, ruusuun, roosaan tai kultaan.
- Burgundi taittuu purppuraan ja maroon ruskeaan. Pieni ero ratkaisee, tuntuuko liukuväri viiniltä vai ruosteelta.
- Viininpunainen liukuväri samenee sekoittuessaan vihreään, oliiviin tai lämpimään harmaaseen. Kulje sen sijaan ruusun, luumun tai lähes mustan kautta.
- Kermanvärinen ja lämmin luonnonvalkoinen teksti erottuvat viininpunaisella hyvin. Kulta toimii korostuksena leipätekstin sijaan.
- Viininpunainen sopii viiniin, ravintoloihin ja hotelleihin, kauneuteen, syys- ja talvikampanjoihin, kutsuihin sekä brändeihin, jotka haluavat punaista ilman kiirettä.

**Viininpunainen liukuväri** yhdistää syviä, hieman purppuraisia punaisia: klassisen burgundin `#800020`, viinin `#7f1d3a` ja tumman häränverenpunaisen `#4a0e1f`. Ne häivyttyvät lähes mustaan, pehmenevät ruusuun ja roosaan tai saavat valoa kullasta. Täyteläisyys säilyy sekoittamalla vain sukulaisväreihin: punaisiin, ruusuihin, luumuihin ja hyvin tummiin ruskeisiin. Valitse rinnalle kerma tai kulta valkoisen sijaan. Alta löydät koodit, burgundin, maroonin ja viinin erot sekä toimivat tekstivärit.

## Burgundi, maroon, viini ja häränverenpunainen

Näitä nimiä käytetään väljästi, mutta niiden suunnat eroavat, mikä vaikuttaa liukuväriin. Burgundi ja viini taittuvat purppuraan ja sekoittuvat kauniisti luumuun sekä ruusuun. Maroon ja häränverenpunainen taittuvat ruskeaan ja sopivat nahkaan, vaaleanruskeaan sekä messinkiin. Ruosteelta näyttävässä liukuvärissä on luultavasti ruskeaa maroonia ja viileää pinkkiä.

- Kellari: #2a0a12
- Häränverenpunainen: #4a0e1f
- Maroon: #800000
- Burgundi: #800020
- Viini: #7f1d3a
- Granaatti: #9f1239
- Murrettu ruusu: #be7c8c
- Puuteriroosa: #e8b4b8

Syvänpunainen perhe kellarin tummasta puuteriroosaan. Maroon on ruskein, viini ja granaatti purppuraisimmat.

## Syvän viininpunaisen liukuvärin koodit

Hyödyllisimmät viininpunaiset liukuvärit ovat tummia: lähes mustasta pohjasta nousee viininvärinen valo. Ne tuntuvat arvokkailta, koska kirkasta väriä on vähän ja se hohtaa. Pidä vaalein punainen poissa tekstin kohdalta.

- Kellarista burgundiin: `linear-gradient(160deg, #2a0a12 0%, #4a0e1f 45%, #800020 100%)`
- Viini kynttilänvalossa: `radial-gradient(circle at 70% 25%, #9f1239 0%, #4a0e1f 40%, #14050a 80%)`
- Maroon-nahka: `linear-gradient(135deg, #800000 0%, #4a0e1f 55%, #1c0a08 100%)`
- Samettiverho: `radial-gradient(ellipse at 50% 100%, #7f1d3a 0%, #3b0a1c 45%, #0f0508 85%)`

Neljä tummaa viininpunaista liukuväriä. Jokainen pitää kirkkaimman punaisen yhdessä paikassa ja jättää rauhallisen tumman alueen tekstille.

Nämä ovat lähellä [punaisten liukuvärien](https://gradiently.design/fi/guide/red-gradient) tummaa päätä, mutta niissä on vähemmän tulta ja enemmän syvyyttä. Tummat punaiset raitautuvat helposti pakatuissa kuvissa, joten lisää hieman rakeisuutta ennen vientiä.

## Viininpunainen, kulta, roosa ja luumu

Viininpunainen toimii harvoin pitkään yksin. Klassiset parit muuttavat tunnelmaa: kulta tekee siitä muodollisen ja juhlavan, roosa romanttisen ja pehmeän, luumu tunnelmallisen ja modernin. Vierelle sijoitettu laivastonsininen, ei sekoitettuna, tuo yliopistotunnelmaa.

- Burgundi ja kulta: `linear-gradient(135deg, #4a0e1f 0%, #800020 82%, #d4a24c 100%)`
- Viinistä roosaan: `linear-gradient(180deg, #7f1d3a 0%, #be7c8c 55%, #f5dede 100%)`
- Luumusta burgundiin: `linear-gradient(120deg, #3b0764 0%, #6b1d4a 50%, #800020 100%)`
- Ruusu pimeässä: `radial-gradient(circle at 20% 80%, #e8b4b8 0%, #9f1239 40%, #2a0a12 85%)`

Burgundi neljän parhaan kumppaninsa kanssa. Kulta jää kapeaan reunaan, muut sekoitukset pysyvät punaisissa, pinkeissä ja purppuroissa muuttumatta ruskeiksi.

Viininpunaisen ja kullan kanssa on helpointa liioitella. Pidä kulta ohuena reunana tai tekstissä, jolloin ilme muistuttaa laatuviiniä eikä naamiaisasua. Lisää tummasta kullasta: [mustan ja kullan liukuvärit](https://gradiently.design/fi/guide/black-and-gold-gradient).

## Näin viininpunainen liukuväri ei muutu ruskeaksi

1. **Valitse suunta: purppura vai ruskea** Päätä, taittuuko viininpunainen viiniin vai nahkaan, ja pidä kaikki värit samassa suunnassa.
2. **Tummenna lähes mustaan, älä harmaaseen** Lämpimään harmaaseen häipyvä burgundi näyttää pölyiseltä. Punaiseen taittuva musta, kuten `#14050a`, säilyttää täyteläisyyden.
3. **Älä sekoita vihreään tai oliiviin** Vihreä on punaisen vastaväri, joten keskikohta muuttuu harmaanruskeaksi. [Sameat liukuvärit](https://gradiently.design/fi/guide/muddy-gradients) näyttää vaikutuksen.
4. **Vaalenna ruusulla, älä oranssilla** Vaalenna granaatin ja murretun ruusun kautta. Oranssi vetää kohti ruostetta.
5. **Lisää hienoa rakeisuutta** Syvät punaiset pakkautuvat huonosti ja raitautuvat. Kevyt kohinakerros tasoittaa pintaa ja tuo sametin tai paperin tuntua.

## Tekstivärit viininpunaisella liukuvärillä

Viininpunainen on niin tumma, että vaalea teksti erottuu lähes kaikkialla. Puhdas valkoinen voi kuitenkin tuntua kovalta. Lämmin kerma pitää ilmeen pehmeänä. Kulta erottuu tummimmilla punaisilla ja sopii nimiin sekä päivämääriin, mutta käytä sitä isona. Alla olevat suhteet lasketaan WCAG-kaavalla, jossa pienen tekstin tavallinen vähimmäiskontrasti on 4,5:1.

| Tausta | Teksti | Kontrasti | Käyttö |
| --- | --- | --- | --- |
| Burgundi `#800020` | Valkoinen `#ffffff` | 10,8:1 | Kaikki teksti |
| Viini `#7f1d3a` | Kerma `#fdf2e9` | 8,9:1 | Kaikki teksti, pehmeämpi tunnelma |
| Häränverenpunainen `#4a0e1f` | Kerma `#fdf2e9` | 13,9:1 | Kaikki teksti |
| Kellari `#2a0a12` | Kulta `#d4a24c` | 7,9:1 | Nimet, päivämäärät, otsikot |
| Puuteriroosa `#e8b4b8` | Häränverenpunainen `#4a0e1f` | 8,5:1 | Tumma muste vaaleassa päässä |
| Murrettu ruusu `#be7c8c` | Valkoinen `#ffffff` | 3,3:1 | Vain isot otsikot |

Jos liukuväri kulkee viininpunaisesta roosaan, pidä sanat yhdessä päässä tai vaihda tekstiväriä niiden ylittäessä rajan.

Viininmaistelun pystyjulkaisu, jossa kermanvärinen teksti on tummalla viininpunaisella liukuvärillä

Viinibaarin julkaisu syvällä viininpunaisella pohjalla ja kermanvärisellä tekstillä.

Päivämääräkutsu, jossa viininpunainen häipyy roosaan ja tumma teksti on vaaleassa päässä

5×7 in -kutsu, jossa viininpunainen pehmenee roosaksi.

Molemmissa suunnitelmissa teksti pysyy liukuvärin yhdessä päässä. [Teksti liukuvärillä](https://gradiently.design/fi/guide/text-on-gradient) selittää tummasta vaaleaan kulkevan rivin käsittelyn.

## Viininpunainen liukuväritausta CSS:llä

```css
.section--wine {
  background-color: #2a0a12;
  background-image:
    radial-gradient(circle at 75% 20%, #9f1239 0%, transparent 45%),
    radial-gradient(circle at 10% 95%, #4a0e1f 0%, transparent 55%),
    linear-gradient(160deg, #2a0a12 0%, #800020 100%);
  color: #fdf2e9;
}

.section--wine .accent {
  color: #d4a24c;
}
```

Tumma kellaripohja, granaattivalo oikealla ylhäällä, häränverenpunainen varjo vasemmalla alhaalla, kermanvärinen teksti ja kultakorostus.

Lineaarisen pohjan päälle pinotut säteittäiset liukuvärit tuovat viininpunaiselle kankaan syvyyttä tasaisen täytön sijaan. [CSS:n säteittäiset liukuvärit](https://gradiently.design/fi/guide/css-radial-gradient) käsittelee ideaa tarkemmin.

## Mihin viininpunainen sopii

Viininpunainen kantaa punaisen lämpöä ilman kiirettä. Siksi sitä näkee harvoin tarjousbannereissa ja usein ruokalistoissa, kutsuissa ja etiketeissä. Se sopii viinibaareihin ja ravintoloihin, kauneuteen ja tuoksuihin, kirjakauppoihin, yliopistoihin, talvi- ja juhlakampanjoihin sekä syysmallistoihin. Se sopii myös lifestyle-brändien [maanläheisiin väripaletteihin](https://gradiently.design/fi/guide/earth-tone-colors) syväksi korostukseksi vaaleanruskean ja oliivin joukkoon.

Jos haluat omasi tuntuisen syvänpunaisen ilmeen kaikkien kopioitavan hex-koodin sijaan, selaa burgundi- ja viini-Markit Gradientlyn Markkinoilla hakusanalla ”wine”. Jokainen Mark on ainutlaatuinen, piirtyy tarvitsemiisi kokoihin ja pitää sanat luettavina tummissa sekä vaaleissa kohdissa.

## FAQ

### Mikä on burgundin hex-koodi?

Klassinen burgundi on `#800020`. Viini on noin `#7f1d3a` ja tummempi häränverenpunainen noin `#4a0e1f`.

### Miten burgundi eroaa maroonista?

Burgundi taittuu hieman purppuraan kuten punaviini. Maroon, `#800000`, taittuu hieman ruskeaan. Ero määrää sopivat sekoitusvärit.

### Mitkä värit sopivat viininpunaiseen liukuväriin?

Kulta, roosa, murrettu ruusu, luumu, kerma ja lähes musta toimivat. Laivastonsininen sopii viereen, mutta vältä sekoitusta vihreään tai oliiviin, joka samenee.

### Mikä tekstiväri sopii viininpunaiselle?

Kerma tai valkoinen erottuu hyvin noin 9:1-11:1-kontrastilla. Kulta sopii otsikoihin ja nimiin tummimmilla punaisilla.

### Miksi viininpunainen liukuvärini näyttää ruskealta?

Se sekoittuu luultavasti oranssiin, oliiviin tai lämpimään harmaaseen, tai yhdistää ruskean maroonin viileään pinkkiin. Pidä väripisteiden suunta samana ja häivytä punaiseen taittuvaan mustaan.