首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >更改SVG颜色

更改SVG颜色
EN

Stack Overflow用户
提问于 2010-03-20 02:17:54
回答 2查看 11.6K关注 0票数 4

您可以在SVG中更改形状的颜色吗?目前我正在使用一个PNG,我必须在Photoshop中为每个不同的菜单手动创建,我想知道我是否可以使整个过程动态。

EN

回答 2

Stack Overflow用户

发布于 2010-03-21 15:40:17

你可以使用色调旋转滤镜,或者你可以按照上面的建议修复颜色。可能更兼容,可以根据需要更改颜色,但无论如何,下面是滤镜变体的一个示例:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <filter id="h200" x="0" y="0" width="1" height="1">
    <feColorMatrix type="hueRotate" values="200"/>
  </filter>
  <image xlink:href="http://imgur.com/D9aFo.png" width="207" height="46" filter="url(#h200)"/>
</svg>

如果你使用支持here过滤器的浏览器,例如Opera或火狐,你可以看到它的实时svg。

票数 2
EN

Stack Overflow用户

发布于 2012-01-30 22:42:28

@Brendan_Long是正确的,您所需要的只是path对象上的样式标签。点击此处查看演示:http://kemputing.com/demo/shapeDemoColour.svg

代码如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 <path
 style="fill:#000080;"
 d="M 125.0,478.0 172.0,305.0 337.0,266.0 508.0,438.0 482.0,586.0 287.0,659.0 z"
 id="path2985"/>

创建一个与您的图像匹配的路径,然后以编程方式更改附加到它的颜色。您可能希望使用像inkscape这样的工具来提供帮助。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2481641

复制
相关文章
[踩坑]iconfont Symbol svg引入无法更改颜色
最近公司组织架构调整(反正每次组织架构调整,领导就会下场。有一个idea或者有重构一下,先定一个月底上),被拉取一个项目组做新项目。这边图标现状:有些项目是font-face方式,有些用的阿里图标库,最近又在用腾讯图标库,有些甚至直接切图。
玖柒的小窝
2021/11/16
3.7K0
[踩坑]iconfont Symbol svg引入无法更改颜色
SVG绘制渐变颜色文字
H5提供了很多有意思的新特性,工作中用的比较少,但是这仍然不能阻碍我们对它的兴趣,先给大家上个图,如果要用CSS来写这个效果,如何才能实现呢?
越陌度阡
2020/11/26
2.2K0
SVG绘制渐变颜色文字
Android 自定义 svg 颜色
源码注释告诉了我们:此获取的drawable不与其他drawable 共享,简而言之,就是构建单独的内存模块来存储此drawable达到相互不影响的状态。
stormKid
2018/10/18
2.2K0
Android 自定义 svg 颜色
keil更改黑色背景颜色「建议收藏」
1、先将keil安装目录下UV4中global文件复制出来留作备用,然后用记事本打开安装目录下的global文件
全栈程序员站长
2022/09/10
7.6K0
keil更改黑色背景颜色「建议收藏」
如何更改 Ubuntu 的终端的颜色
但是,如果你想要一个独一无二的的终端体验或者符合你自身品位的一些东西,你也可以改变你的 Ubuntu 的终端的颜色。
用户1880875
2021/11/08
14.6K0
Android系统更改状态栏字体颜色
原文地址:http://blog.isming.me/2016/01/09/chang-android-statusbar-text-color/,转载请注明出处。 随着时代的发展,Android的状态栏都不是乌黑一片了,在Android4.4之后我们可以修改状态栏的颜色或者让我们自己的View延伸到状态栏下面。我们可以进行更多的定制化了,然而有的时候我们使用的是淡色的颜色比如白色,由于状态栏上面的文字为白色,这样的话状态栏上面的文字就无法看清了。因此本文提供一些解决方案,可以是MIUI6+,Flyme4+
非著名程序员
2018/02/02
2.5K0
更改Linux终端颜色主题【Linux-Command line】
如果你一整天都盯着终端,自然想让它变得赏心悦目。 对美的判断因人而异,自CRT串行控制台问世以来,终端已经走了很长一段路。 因此,很有可能你的软件终端窗口中有很多选项可以使你看到的内容主题化,不管你如何定义美。
QRosie
2019/11/24
9K0
更改Linux终端颜色主题【Linux-Command line】
SecureCRT更改vim中#注释的文本内容颜色
今天在学习redis的时候,发现vim打开redis.conf配置文件的时候,#注释起来的代码是蓝色的,阅读起来很不方便。
上分如喝水
2021/08/16
6.2K0
SecureCRT更改vim中#注释的文本内容颜色
三种方式:object、embed、mask引用 Svg 并更改样式
方式1:使用Object、embed标签引入 html <div class="item"> <object data="test.svg" type="image/svg+xml"></object> <embed src="test.svg" type="image/svg+xml" /> </div> 更改颜色,大小可通过css处理 .item { overflow: hidden; object,embed { cursor: pointer; filter: dro
White feathe
2022/04/21
1.2K0
更改PPT所有页面字体与页面颜色的技巧
在评估期间,无心插柳地探索到一个新技术,就是关于PPT课件统一更改字体颜色和页面背景颜色的问题。
用户1191760
2019/02/27
5.6K0
SVG - 创建SVG图片
SVG - 创建SVG图片 HTML5学堂:之前在绘图中使用到了SVG以及Canvas,因此决定最近将绘图类的知识和大家分享一下。从研究角度来说,SVG比Canvas要难很多。没有合适的中文文档,自己只能去翻译英文文档(唉,英语不好啊)。今天先来说说SVG的基本知识以及创建SVG的基本方法。 SVG是什么 W3C推荐的网页图形格式,类似于Flash,SVG是一种描述二维矢量图形的标记语言,但它是一种开发的以XML为基础的语言,不是一种私有语言。 SVG的支持程度 IE8-以及Android 2.3默认浏览器
HTML5学堂
2018/03/12
4.1K0
如何在Ubuntu 18.04中更改文件夹图标的颜色
这个快速提示教程向您展示了如何在Ubuntu 18.04 Nautilus文件浏览器中设置文件夹的自定义颜色或标志。
用户8705057
2021/06/08
4.2K0
SVG绘图-SVG.js
官方文档:https://svgjs.dev/docs/3.0/getting-started/
码客说
2021/12/05
6.3K0
SVG绘图-SVG.js
MATLAB 柱状图(Bar) 如何快速更改堆叠图的颜色
写博客的初衷是分享经验,同时是算是自己对思路和代码的整理,方便日后处理数据,应该可以帮到很多人。 我已免费分享我的心得,如果看官还有其他问题的,那么:知识付费,我的时间和经验正好可以解决你的问题。 咨询问题请添加QQ:819369354 2022年4月20日
全栈程序员站长
2022/11/02
5.3K0
MATLAB 柱状图(Bar) 如何快速更改堆叠图的颜色
Python 图形化界面基础篇:更改字体、颜色和样式
在创建图形用户界面( GUI )应用程序时,如何显示文本内容是一个重要的考虑因素。你可能需要更改文本的字体、颜色和样式以满足设计需求或提高用户体验。在 Python 中,使用 Tkinter 库可以轻松实现这些文本样式的更改。在本篇博客中,我们将重点介绍如何使用 Python 的 Tkinter 库来更改字体、颜色和样式。
小蓝枣
2023/10/17
1.7K0
Python 图形化界面基础篇:更改字体、颜色和样式
SVG - 基本的SVG属性
SVG - 基本的SVG属性 HTML5学堂:在前一篇文章当中,我们讲解了SVG的基本知识,并且为大家介绍了如何在html文件当中书写SVG代码。今天我们具体讲解SVG的基本属性,如何使用SVG完成线、圆等图形的绘制。 line - 直线 拥有四中基本属性 x1 属性在 x 轴定义线条的开始 y1 属性在 y 轴定义线条的开始 x2 属性在 x 轴定义线条的结束 y2 属性在 y 轴定义线条的结束 demo <line x1 = "20" y1 = "20" x2 = "200" y2 = "180" st
HTML5学堂
2018/03/12
4.1K0
点击加载更多

相似问题

SVG图像更改颜色

10

SVG对象-更改颜色

20

SVG Favicon颜色更改

121

无法更改SVG填充颜色

30

更改svg颜色div hitbox

05
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文