Gradient CSS online - Generator, Creator și Fundal

Color

Instrumentul de gradient CSS online

CSS Gradient este un mic site fericit și un instrument gratuit care vă permite să creați un fundal gradient pentru site-uri web. 

Gradienții CSS vă permit să afișați tranziții netede între două sau mai multe culori specificate.

CSS definește două tipuri de gradienți:

  • Gradienți liniari (în jos/sus/stânga/dreapta/diagonală)
  • Gradienți radiali (definiți de centrul lor)

Gradienți liniari CSS

Pentru a crea un gradient liniar trebuie să definiți cel puțin două opriri de culoare. Opririle de culoare sunt culorile între care doriți să redați tranziții fine. De asemenea, puteți seta un punct de pornire și o direcție (sau un unghi) împreună cu efectul de gradient.

Sintaxă

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: