From 2d1d1fee1c0773cc7068a3e6471858c92e812afe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?andr=C3=A9s=20gonz=C3=A1lez?= Date: Thu, 13 Feb 2025 10:42:56 +0100 Subject: [PATCH] :books: Info about gradients (#5843) --- docs/img/styling/color-picker-gradient.webp | Bin 0 -> 8862 bytes docs/user-guide/styling/index.njk | 13 ++++++++++++- 2 files changed, 12 insertions(+), 1 deletion(-) create mode 100644 docs/img/styling/color-picker-gradient.webp diff --git a/docs/img/styling/color-picker-gradient.webp b/docs/img/styling/color-picker-gradient.webp new file mode 100644 index 0000000000000000000000000000000000000000..eec479e7023901e06f6e8caff00a22e133d33691 GIT binary patch literal 8862 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
  • Eyedropper - Allows you to pick any color of the objects at the viewport.
  • Color profiles - Select between RGB, the Harmony Wheel or HSV.
  • -
  • Color type - Solid, linear gradient, radial gradient or image.
  • +
  • Color type - Solid, gradient, or image.
  • Sliders - Easily manage settings like brightness, saturation or opacity.
  • Values - Set precise color values of red(R), green(G), blue(B) and transparency(A).
  • Libraries - Switch between recent colors and libraries.
  • Color palette - A quick launcher of the palette with the selected library.
  • +

    Gradients

    +

    You can apply gradient fills to layers. To do that select the Gradient type at the color picker.

    +
    + Gradient +
    +

    You can choose between two types of gradients:

    +
      +
    • Linear Gradient: A smooth transition between two or more colors along a straight line, with the option to adjust the angle.
    • +
    • Radial Gradient: A circular color transition that starts with one color at the center and gradually shifts to another at the edges, which could be a different color or a fade to transparency.
    • +
    +

    Color palette

    The color palette allows you to have a selected color library in plain sight.