When creating gradients, you can use any valid CSS color value, including named colors, hex codes, rgb/rgba values, and hsl/hsla values. However, gradients in Chakra UI have a limitation. Since gradient values often contain commas, they cannot be used with the responsive array syntax directly.
To import the Box component used below:
To work around the limitation mentioned above, you can define gradient values in the theme and reference them by name:
Did you know?
Creative Idea No. 1
Creative Idea No. 2
Creative Idea No. 3