Как изменить цвета значков SVG с помощью TailwindHtml

Программисты Html
Ответить
Anonymous
 Как изменить цвета значков SVG с помощью Tailwind

Сообщение Anonymous »

Я использую Tailwindcss и хочу изменить цвет SVG. Без тройного ветра этот вопрос был задан ранее здесь, на 2020 год это должен быть хороший ответ, но Tailwind не поддерживает эти фильтры. В документах есть руководство о том, как работать со значками SVG, но этот урок работает без файлов, просто простые текстовые пути. В следующем примере показан моя проблема, я хочу, чтобы фон значка был красным, а цвет - синий. К сожалению, мне невозможно изменить цвет значка.

Код: Выделить всё



[img]data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSI2MHB4IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA2MCA2MCIgd2lkdGg9IjYwcHgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48dGl0bGUvPjxkZXNjLz48ZGVmcy8+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBpZD0iYmxhY2siIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIj48ZyBpZD0ic2xpY2UiLz48ZyBmaWxsPSIjMDAwMDAwIiBpZD0idHdpdHRlciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTMuMDAwMDAwLCAxNi4wMDAwMDApIj48cGF0aCBkPSJNMjguMDUyMTM4NSwyLjQzNjY5NDI3IEMyNi44NDMxODQ2LDEuMDYyMjAxNSAyNS4xMjA1Mzg1LDAuMTg2NDY0MTA1IDIzLjIxNDA2MTUsMC4xNTQ3MzEwMjggQzE5LjU1MzYsMC4wOTM4MDMwOTA1IDE2LjU4NTY1MzgsMy4xODY5MjMzOSAxNi41ODU2NTM4LDcuMDYzMTE2MDQgQzE2LjU4NTY1MzgsNy42MTMyNDExOCAxNi42NDQyOTIzLDguMTQ5NjkzMzcgMTYuNzU3MzY5Miw4LjY2NDY3MzE2IEMxMS4yNDg1ODQ2LDguMzA3MzUyNTcgNi4zNjQ0NjkyMyw1LjQzODc3MDU5IDMuMDk1NDE1MzgsMS4xMTQ3MjE4IEMyLjUyNDg2MTU0LDIuMTUwODYxNyAyLjE5NzkwNzY5LDMuMzYxODgyNzEgMi4xOTc5MDc2OSw0LjY1OTE1MDM3IEMyLjE5NzkwNzY5LDcuMTE0OTg4NDQgMy4zNjgwOTIzMSw5LjI5NDUyNzI0IDUuMTQ2NjMwNzcsMTAuNTgxNDE3NCBDNC4wNjAxMjMwOCwxMC41MzM0NDk5IDMuMDM4MDY5MjMsMTAuMjA0NTM3OCAyLjE0NDQzODQ2LDkuNjY0OTUyMDMgQzIuMTQzNzkyMzEsOS42OTQ0NDQ5NyAyLjE0Mzc5MjMxLDkuNzIzOTQ0OTQgMi4xNDM3OTIzMSw5Ljc1Mzk2MjQ1IEMyLjE0Mzc5MjMxLDEzLjE4MzU0OTcgNC40Mjg1OTIzMSwxNi4wNjA3MDc2IDcuNDYwODMwNzcsMTYuNzMwOTM4MyBDNi45MDQ2NTM4NSwxNi44ODg1MzggNi4zMTkwNzY5MiwxNi45NzEwMTYzIDUuNzE0NiwxNi45NjcwMDggQzUuMjg3NDkyMzEsMTYuOTY0MTc1OCA0Ljg3MjE3NjkyLDE2LjkxNjgxMTggNC40Njc1MjMwOCwxNi44MzE3NjggQzUuMzEwOTE1MzgsMTkuNjQ0Mzc3NyA3Ljc1ODcwNzY5LDIxLjY5Njc2NjMgMTAuNjU5MjkyMywyMS43NjQ2MjggQzguMzkwODA3NjksMjMuNjQ3Njk2MyA1LjUzMjg2OTIzLDI0Ljc2OTE5MzMgMi40MjcyOTIzMSwyNC43NjI3ODcgQzEuODkyMjc2OTIsMjQuNzYxNjgzMyAxLjM2NDY5MjMxLDI0LjcyNzExMiAwLjg0NjE1Mzg0NiwyNC42NjA1OTk2IEMzLjc3OTUzMDc3LDI2LjY3MzMxMzkgNy4yNjM1OTIzMSwyNy44NDUxNzExIDExLjAwNjc2MTUsMjcuODQ2MTUzMSBDMjMuMTk4NTUzOCwyNy44NDkzNTE4IDI5Ljg2NTczMDgsMTcuMjM5NTEwOSAyOS44NjU3MzA4LDguMDM2NzY4NjggQzI5Ljg2NTczMDgsNy43MzQ4MzYzMiAyOS44NTkxMDc3LDcuNDM0NTE5MTIgMjkuODQ2NTA3Nyw3LjEzNTY1MTk1IEMzMS4xNDE1NjE1LDYuMTcwNjY2NDUgMzIuMjY1MjIzMSw0Ljk2MDc4OTE1IDMzLjE1Mzg0NjIsMy41NzkyMTkwMSBDMzEuOTY1MjQ2Miw0LjExNTAxNjE1IDMwLjY4NzYzODUsNC40NzA4Njg2MyAyOS4zNDcwMzA4LDQuNjIwMTM3ODkgQzMwLjcxNTQyMzEsMy43Nzc5NjUxOCAzMS43NjY1NTM4LDIuNDMwMDk2MDcgMzIuMjYxMzQ2MiwwLjgxMzc1ODQwNCBDMzAuOTgwNTA3NywxLjU5MDQ5MjI5IDI5LjU2MjAzODUsMi4xNDc1MTI4NiAyOC4wNTIxMzg1LDIuNDM2Njk0MjcgWiIvPjwvZz48L2c+PC9zdmc+[/img]
< /code>
< /div>
< /div>
< /p>
Какой правильный рабочий процесс при загрузке значков SVG и используйте их непосредственно, связывая путь активов? Все, чего я хочу достичь, это что -то вроде этого < /p>
[url=https://twitter.com]
[img]pathToSvgInAssetsFolder[/img]
[/url]
< /code>
и установите цвет значка на пользовательский цвет ветра, например, Red-500 
. Поэтому, когда я хочу изменить цвет значков, я могу просто изменить класс цвета.
Кто -то знает, как это сделать?

Подробнее здесь: https://stackoverflow.com/questions/641 ... h-tailwind
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»