• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > Iconfinder 开发了一个超强大的图标在线编辑器!

Iconfinder 开发了一个超强大的图标在线编辑器!

作者: 字体:[增加 减小] 来源:互联网 时间:2018-08-23

本文主要包含图标下载,图标素材,经验分享,酷站推荐等相关知识,希望在学习及工作中可以帮助到您

Iconfinder 无疑是全世界前几大的免费图标搜索引擎,这个网站收录大量丰富的图标,在 Iconfinder 可找到适合各种设计配色的图案,对于设计师及开发者来说是一项非常值得加入收藏的免费资源,图标库虽多但不一定能符合你的需求,很多时候必须经过微调,因此这一年 Iconfinder 收到最多的功能请求是希望可以加入图标编辑器,而现在众所期盼的新功能真的来了。

Iconfinder Icon Editor 是 Iconfinder 免费图标网站新推出的功能,也是一款免费、简易版在线图标编辑工具,不用额外下载或安装软件,只要通过浏览器就能使用,对于要调整图标颜色、大小或加入文字都非常简单。如果手边没有矢量图编辑软件(或是平常很少用编辑器)的朋友,它绝对可以满足最基本的图标编辑需求。

Iconfinder Icon Editor 另一特色是直接和 Iconfinder 图标库整合,在搜寻图标后直接将图案传送到编辑器进行处理,完全省去中途需要先下载再上传编辑耗费的时间。除此之外,它也允许使用者开启 SVG 矢量图来在线编辑,不限于 Iconfinder 自家图标。编辑完成后可导出为 SVG 或转 PNG 格式,各种大小尺寸一应俱全。

Iconfinder Icon Editor

地址:https://www.iconfinder.com/icon-editor

STEP 1

如果你想透过 Iconfinder Icon Editor 编辑在 Iconfinder 免费图标网站搜寻到的图案,只要在图标页面点击下方的「Edit Icon」(编辑图标)按钮就可以了,因为是新功能,旁边还会加上特殊效果。

若你不需要编辑也可点击下方「Download SVG」或「Download PNG」下载对应格式,Iconfinder 除了有付费图标外,还能通过搜索筛选功能来显示出免费项目。

STEP 2

接着图标自动汇入Iconfinder Icon Editor,等待一下就能开始利用简单的在线矢量图编辑器编辑。虽然是个在线编辑器,但速度很快、操作相当流畅,不会有一般编辑器的延迟或过度耗用资源的状况发生,也是我会推荐这个矢量图在线编辑工具的另一个原因。

若你想将 Iconfinder Icon Editor 做为一般的编辑器使用,点击上方选单「File」然后找到第二个选项「Open SVG」就能直接开启计算机里的 SVG 矢量图。

STEP 3

Iconfinder Icon Editor 就如同一般编辑器,可以点选图标里任何部分,让它变换颜色(从左侧选单下方点击调色盘)、调整位置、大小或旋转,若遇到图标方向角度不对时也可以通过这个编辑器来将图标翻转。

在测试Iconfinder Icon Editor后真的觉得编辑功能非常简单、快速。例如我想要调整图标中某个部分颜色,只要点击一下,选取后再从左下角找到调色盘,就能快速把图标的某部分颜色变换,完全不用担心不会使用矢量图编辑软件。

STEP 4

矢量图的每个部分都是一个对象,可通过 Shift 或 Ctrl 等组合键来多重选取,重设大小、旋转、移动位置或变换颜色。

STEP 5

Iconfinder Icon Editor 另一个特色是可以在矢量图标内插入文字,而且支持中文显示,当切换到文字工具时,右侧可以调整位置、字型、样式、字体大小等细节。

STEP 6

完成后,直接点选右上角的「Download Icon」就会跳出导出格式选项,默认情况下可导出为矢量图 SVG 格式(或通过快捷键输出、下载),也能在线转换格式为 PNG 位图,且有 16px、32px、64px、128px、256px 及 512px 等各种大小可供选择。

想起之前介绍的「FlattyShadow 超过 500 个扁平化设计免费图标下载,可在线调整颜色阴影」也有定制化图标功能,相较于 Iconfinder Icon Editor 来说虽然功能上差一大截,但看得出来现在图标网站也必须提供更多自定义功能,才能让用户更有下载使用的冲动,而且图标自定义后风格表现也会更符合使用者需求。

值得一试的三个理由:

  • 开启浏览器就能使用,免下载、安装软件,也不用注册账号。
  • 整合 Iconfinder 免费图标网站,可快速编辑在线图标。
  • 导出为 SVG 或转档成各种大小的 PNG 图。

「强烈推荐!更多免费图标网站」

  • 《酷站两连发!超过500个免费矢量图标素材可商用下载》
  • 《酷站两连发!免费打包40,000个图标+日本图标素材站》
  • 《酷站两连发!收录高达130万免费图标素材的两个网站》

================明星栏目推荐================

优优教程网: UiiiUiii.com是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备:http://hao..com

优设大课堂

您可能想查找下面的文章:

  • 未来就在这里! 一组AR 和VR 相关的图标合集免费打包下载
  • Iconfinder 开发了一个超强大的图标在线编辑器!
  • 超过200万个高质量的图标素材免费下载,还可以自定义配色和大小!
  • 不止15个!可能是最全面的图标素材站+制作神器

相关文章

  • 2018-08-23也许你该注意一下影响网页设计的这5个关键指标
  • 2018-08-23进阶必读!可能是最全面的组件化开发与设计指南
  • 2018-08-23超全面总结!「完美」的字体系统搭建与维护指南
  • 2018-08-23AI教程!教你 3 步做出高格调的悖论空间
  • 2018-08-23如何用产品开发三原则模型,帮我们做好产品设计
  • 2017-08-06Bootstrap之所以广泛流传的11大原因
  • 2017-08-06水平滚动的网站设计 小结
  • 2018-08-23科普小课堂!设计师怎样从零开始设计一款APP?
  • 2018-08-23经常被忽略的动效,对于用户体验设计是如此重要
  • 2017-08-06网站界面设计中为网站创建风格指南的方法(图文)

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 浅色还是深色?教你选择合适的界面配色方案!
    • 学习按钮设计,看这篇就够了!
    • 网易设计师:帮你学会万能的深度访谈方法
    • 用“三分法”构图本没有错,错的是你的使用姿势!
    • 超实用!信息架构基础知识科普手册
    • 可自由编辑!一份30页的坚果Pro情怀PPT模板
    • 《连线》杂志主编制作了八集设计纪录片,阵容很强大
    • 名额有限!小光老师零基础手绘第6期来啦(周五开课)
    • 超干货!一套完整的设计分析思路应该是怎样的?
    • 方便高效!五分钟看懂微信团队打造的新Sketch 插件WeSketch

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有