I tried everything, I can’t put gradient degrade on icons like these here [image]

I’ve tried everything and I can’t change :frowning:

.d-icon.d-icon-d-tracking, .d-icon.d-icon-d-watching { 1. background-image: linear-gradient(to right, #4c6c81, #083263); } [image] .d-icon.d-icon-d-tracking, .d-icon.d-icon-d-watching { 1. color: red; } [image]

Hi, From what I read in Gradients in SVG - SVG | MDN , you must add <linearGradient> to the SVG. Others resources: Gradient fills for SVG icons SVG Gradients What you can do is create a hidden SVG in your theme/component to define your gradients: <svg aria-hidden="true" focusable="false" style=…

Hello everything is fine? thank you very much for answering me so I had tried this method once, but I couldn’t understand it properly (even more so because I don’t understand English) but it didn’t work, I tried the way you showed me and this time the icons change, but they don’t change for the gra…

I edited my theme CSS/HTML vis Customize → Themes from the admin panel. Either edit your theme or create a theme component here by following Beginner's guide to using Discourse Themes . Click on Edit CSS/HTML In Body tab, you put the SVG code In Common tab, you put the CSS [image] [ima…

I had so much trouble with this, and the problem was in the way I was putting it lol, thank you very much for teaching me how to put it in the right place, I will always be grateful for your help, thank you very much

Como colocar gradiente em ícones finos?

Dev

danielabc (Daniela) Março 31, 2023, 5:34am 7

Tive tantos problemas com isso, e o problema estava na forma como eu estava colocando, lol, muito obrigado por me ensinar a colocar no lugar certo, serei sempre grato pela sua ajuda, muito obrigado.

Tópico		Respostas	Visualizações
Does Discourse accept SVG icons with Gradient? Development	6	625	1 de Maio de 2023
Icons made in Inkscape and Photoshop do not have colors changed via CSS Development	7	590	9 de Junho de 2023
Rainbow Header Gradient for Discourse Theme component	0	720	30 de Março de 2024
From text to icon Product Support	15	444	14 de Janeiro de 2025
How did they make a gradient header? Product Support	3	716	28 de Outubro de 2020

Como colocar gradiente em ícones finos?

Tópicos relacionados