Online CSS Gradient - Generator, Maker i Background

Color

Mrežni CSS alat za gradijent

CSS Gradient veselo je malo web-mjesto i besplatni alat koji vam omogućuje stvaranje gradijentnih pozadina za web-mjesta. 

CSS gradijenti omogućuju prikaz glatkih prijelaza između dvije ili više navedenih boja.

CSS definira dvije vrste gradijenata:

  • Linearni gradijenti (ide dolje/gore/lijevo/desno/dijagonalno)
  • Radijalni gradijenti (definirani njihovim središtem)

CSS linearni gradijenti

Za stvaranje linearnog gradijenta morate definirati najmanje dvije točke boje. Zaustavnici boja su boje između kojih želite prikazati glatke prijelaze. Također možete postaviti početnu točku i smjer (ili kut) zajedno s efektom gradijenta.

Sintaksa

background-image: linear-gradient(directioncolor-stop1color-stop2, ...);

CSS Radial Gradients

A radial gradient is defined by its center.

To create a radial gradient you must also define at least two color stops.

Syntax

background-image: radial-gradient(shape size at position, start-color, ..., last-color);

By default, shape is ellipse, size is farthest-corner, and position is center.

Set Shape

The shape parameter defines the shape. It can take the value circle or ellipse. The default value is ellipse.

The following example shows a radial gradient with the shape of a circle: