程序员如何设计logo,如何找Icon和插画(绝对干货)

👉 这是一个或许对你有用的社群

🐱 一对一交流/面试小册/简历优化/求职解惑,欢迎加入「芋道快速开发平台」知识星球。下面是星球提供的部分资料: 

533c95daa774e7c213451a96c5c4a464.gif

👉这是一个或许对你有用的开源项目

国产 Star 破 10w+ 的开源项目,前端包括管理后台 + 微信小程序,后端支持单体和微服务架构。

功能涵盖 RBAC 权限、SaaS 多租户、数据权限、商城、支付、工作流、大屏报表、微信公众号、CRM 等等功能:

  • Boot 仓库:https://gitee.com/zhijiantianya/ruoyi-vue-pro

  • Cloud 仓库:https://gitee.com/zhijiantianya/yudao-cloud

  • 视频教程:https://doc.iocoder.cn

【国内首批】支持 JDK 21 + SpringBoot 3.2.2、JDK 8 + Spring Boot 2.7.18 双版本 

来源:古时的风筝


今天给大家带来点儿干货,真真儿的干货。

作为一个程序员,不管你是平时要自己做博客网站、写文章,还是独立开发一些产品,基本上会用到一些图片资源,比如 Logo、插画、icon,哪怕是写 PPT ,也是会用到的。

Logo

几乎做所有的产品都需要一个Logo,不管是APP还是Web应用,亦或者是浏览器插件、IDE插件,甚至是开源项目,都需要一个 Logo。

但是设计这一块儿恰好是程序员的短板,试问一下,有多少人可以用 PS 或者其他设计工具从头设计出一个 Logo 来。

基于这种前提,我们设计Logo的原则是:不用过于惊艳,但是不能太丑。

其实现在最好的方式是用 AI,用文生图大模型是最好了,只要你把 Prompt 设定好。但是这种免费的AI生图工具即便是有,效果也不好,因为我都试过了,所以就不推荐了。

IconKitchen

在这个工具中,你可以选择和你的产品主题匹配的 icon 作为基础元素,然后修改一下颜色、边框圆角、渐变、背景、透明度等等一系列属性。

还可以用自定义文字或者图片作为主体,不管是用作网站logo还是APP图标都没问题。

简单几分钟,就可以生成一个logo出来,中规中矩,没什么大问题。

在线地址:https://icon.kitchen/

cba20d861ef396f8e300e5008b389786.png

LogoFast

这个工具和IconKitchen类似,但是是另外一种风格。

同样可以搜索一个相关度最高的 Icon 作为主体,然后修改背景色、边框、角度这些属性,即可生成出你的Logo了。

在线地址:https://logofa.st/

95772b1a8b70dc0cf22c6b3f38339420.png

还有简单的 AI 生成功能,生成的logo还可以再次进行二次加工。

acbabed29a27c256640b19270fad2b29.png

appicons

这个不是设计Logo的,而是查找Logo的,大部分的APP都能在这上面找到,比如我想找微信的图标做到 PPT 里,直接在这里搜索 wechat 就能找到。

地址:https://appicons.co/?ref=pushkeen

a004c1ce02902eac216a9938c06e8edd.png

基于 Spring Boot + MyBatis Plus + Vue & Element 实现的后台管理系统 + 用户小程序,支持 RBAC 动态权限、多租户、数据权限、工作流、三方登录、支付、短信、商城等功能

  • 项目地址:https://github.com/YunaiV/ruoyi-vue-pro

  • 视频教程:https://doc.iocoder.cn/video/

开源插画网站

有些网站,如果文字内容比较少的话,会搭配一些图片,比如技术博客的首页或者一些落地页。

或者写文章的时候,只有文字会显得枯燥,搭配一些图片效果就会好一些。

vectorCraftr

这个网站有上百个开源插画,当然并非全都是 IT 相关的,还有其他领域的,看你的个人需求选择。

在线地址:https://vectorcraftr.com

比如网站的 404 页面,可以选一张放上去,效果还是不错的。

4295d6ec16047423fd493a1fb4074ff0.png

unDraw

也是各个领域的插画,更灵活一些的是这个网站可以自定义颜色。

在线地址:https://undraw.co/illustrations

43afd3ba0ed2cef3ab13e3700de1d65a.png

KawaiiLogos

准确的说,这其实是Logo 集合,主要是对各种语言、开源中间件的图标做的二次定制,偏向二次元的风格。

在线地址:https://github.com/SAWARATSUKI/KawaiiLogos/tree/main

比如 Next.js的图标长这样

4d638d7d5d77bb4ea9e55a69768045ba.png

基于 Spring Cloud Alibaba + Gateway + Nacos + RocketMQ + Vue & Element 实现的后台管理系统 + 用户小程序,支持 RBAC 动态权限、多租户、数据权限、工作流、三方登录、支付、短信、商城等功能

  • 项目地址:https://github.com/YunaiV/yudao-cloud

  • 视频教程:https://doc.iocoder.cn/video/

Icon

Icon 网站可是太多了,比如国内很早就很多人用的阿里巴巴的 iconfont ,这个就不说了,有好多好多的 Icon,但是很多都是个人设计师的作品放到上面,虽然可以免费下载,但是版权这个东西不太能说的清楚。

Remix Icon

这是国内的一个个人开发者独立运营的,已经稳定运营好几年了,而且一直在更新,图标都是免费的,而且非常全。

在线地址:https://remixicon.com/

a46ec6f53b1573d67f07a8343af7fe81.png

fontawesome

这个国外的Icon网站,图标也是非常全,而且样式很好看,还有单色、多色、不同宽度的,大部分都有免费的版本,但是矢量图 svg 有些尺寸是收费的。

在线地址:https://fontawesome.com/

1440c18822674dd8ac3cb6423b080b23.png

各位有没有什么同类的优质资源,也可以一起分享出来


欢迎加入我的知识星球,全面提升技术能力。

👉 加入方式,长按”或“扫描”下方二维码噢

0a9598ee5117db22db58caea56727890.png

星球的内容包括:项目实战、面试招聘、源码解析、学习路线。

457d472182005f5fc6eaadf94b053bd6.png

5d60d4f8cfa55c1b66b411d75efd7dac.png14186064ac962eb553d33ffb274aa5d8.png6f8e84b53a0cd6e280adb6914778dd42.png091409812868abf3263ce05167adce5e.png

文章有帮助的话,在看,转发吧。
谢谢支持哟 (*^__^*)
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值