To style the linearGradient colors you can use the stop-color attribute on the <stop> elements. <svg class="w-32 h-32 text-blue-500" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg"> <defs> <linearGradient x1="50%" y1="92.034%" x2="50%" y2="7....
But I want to use a linear gradient in place of a simple color. I tried this I also tried to change taiwind.config.js like below module.exports = { content: [ "./pages/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}", ], theme: { extend: { dropS...
background-image: linear-gradient(0deg, rgba(158,28,3,1) 0%, rgba(223,39,0,1) 100%); box-shadow: inset 0 0 20px rgba(0,0,0,0.25), inset 0 2px 4px rgba(0,0,0,0.25), 0 2px 10px rgba(0,0,0,0.5); color: #eeb119; /* Gold */ text-shadow: 0 -1px 0 rgba(0,0...
(--select-border); border-radius: 0.25em; padding: 0.25em 0.5em; font-size: 1.25rem; cursor: pointer; line-height: 1.1; background-color: #fff; background-image: linear-gradient(to top, #f9f9f9, #fff 33%); } .select select, .select::after { grid-area: select; } .select:not(...
How can I make this 5 color linear gradient border just like this image? also the below line? I have tried with this code. bg-gradient-to-r from-[#83C59B] via-[#FCF09A] to-[#71CAEE] but can't set 5 colors. Now I want a 5 color linear gradient border using Tailwi...