【实用推荐】5款设计类浏览器拓展 第一期

观前提示

本期视频尝试使用语音合成作为配音,你觉得这样做如何,留下你的选择,以反馈结果考虑继续使用合成配音或放弃使用合成配音

目前拓展仅推荐主流浏览器,如 Chromium 内核浏览器 以及 Firefox,但不能100%保证拓展拥有多种类型浏览器,推荐内容均是我日常使用或使用过的拓展,安装拓展时请仔细对照拓展信息以及图标,以防下载恶意或冒牌拓展。


0x01 Site Palette 作者:palette.site

拓展简介

如果你在纠结配色问题或喜欢其它网站的配色,那么 Site Palette 可以帮助到你。

你只需要打开喜欢的网站页面,点击 Site Palette 拓展图标,即可快速提取当前页面使用的配色,同时还支持生成分享链接以及下载设计文件快速使用配色

功能介绍

获取网站配色,打开需要提取的网站页面然后点击 Site Palette 即可生成配色

支持浏览器

ChromeEdgeFirefox


0x02 ColorZilla 作者:colorzilla.com

拓展简介

点击 ColorZilla 拓展图标可以在页面顶部弹出取色器,可以通过修改选区范围大小实现更精准的颜色提取,同时会显示颜色实时数据、选择区域范围尺寸、以及选择器与类名,可以通过查看CSS样式直接定位所选范围内容。

选择好颜色可以复制多种颜色类型格式,非常方便。

同时还支持 类似 Site Palette 的页面颜色分析,可以得到当前页面的配色。

功能介绍

取色,点击 ColorZilla 拓展图标可以在浏览器页面内选择鼠标位置下的颜色。

调整,选择菜单中 Color Picker 可以打开颜色选择器进行详细调整颜色数据。

复制,点击 Copy To Clipboard 可以选择复制格式类型到剪贴板

获取网站配色,点击 Webpage Color Analyzer 可以获取网站使用的主要配色

调色板,Palette Browser 可以打开多种类型调色板

CSS生成渐变,点击 CSS Gradient Generator 会打开拓展官方站点通过预设或自定义可以快速生成CSS渐变

支持浏览器

ChromeEdgeFirefox


0x03 Fonts Ninja 作者:fonts.ninja

拓展简介

当你觉得一个网站字体很好看却不知道名字的时候,这款拓展就派上了用场,Fonts Ninja 可以识别当前网站所使用的全部字体,同时可以查看字体支持的字重如 Light、Regular、Blod 等,当鼠标悬浮在字重上还可以显示网站哪部分使用了这个字体与字重,可视化显示,非常方便。

功能介绍

获取网站字体,打开需要提取的网站页面然后点击 Fonts Ninja 即可显示网站使用的字体信息

支持浏览器

ChromeEdgeFirefox


0x04 My Ruler 作者:Leann Pagac

My Ruler 是网页设计师和网页开发人员的测量工具,可以通过拖拽网格圈出范围来查看尺寸以及范围所在的位置。

功能介绍

页面标尺,通过拖拽圈出范围插件范围尺寸以及所在位置

支持浏览器

ChromeEdge


0x05 Unsplash 作者:unsplash.com

不管是网站设计还是其他设计,你都可能需要精美的图片素材,而且全部免费下载,还可以在商业使用。以及不需要许可。

同时即使不安装拓展,可以直接访问 https://unsplash.com/ 进行查看与下载图片。

功能介绍

图片素材,高质量精美图片素材,免费下载与允许商业使用,不需要许可

支持浏览器

ChromeEdge

原创文章,作者:FastChen,如若转载,请注明出处:https://fgpai.com/labs/recommend1.html

发表评论

登录后才能评论