Mikä on liukuväri?
Liukuväri (gradientti) on pehmeä siirtymä kahden tai useamman värin välillä. Verkkosuunnittelussa liukuvärejä käytetään usein taustoissa, painikkeissa ja ylätunnisteissa, koska ne tuovat syvyyttä ja modernin vaikutelman hyvin pienellä koodimäärällä.
Lineaarinen ja radiaalinen liukuväri
Lineaarinen liukuväri vaihtaa väriä suoraa linjaa pitkin. Suunnan määrität kulmalla (0° ylöspäin, 90° oikealle). Radiaalinen liukuväri lähtee keskipisteestä ja leviää ympyränä. Tämä generaattori luo molemmat ja antaa oikean CSS-koodin (linear-gradient tai radial-gradient).
Näin käytät sitä CSS:ssä
Kopioi koodi ja liitä se elementin background-ominaisuuteen. Voit lisätä useita värejä ja muuttaa jokaista muokkaamalla sitä. Jos tarvitset myös sopivan väripaletin, kokeile palettigeneraattoria tai tarkista kontrasti ennen kuin lisäät tekstiä päälle.