[CSS] Useful CSS tool for Web designer and developer
1. Color Picker (Chrome)
You might know how to use color picker in Chrome, recently there is a feature inside color picker which is "Contrast Ratio", which can help developer / design to check whether font color & background has good Contrast ratio for readability.

2. Taxt shadow editor (Chrome):

There is tiny window icon for text-shadow, when you click it, it will open an editor for you to edit text-shadow.

4. Grid layuot inspector (Firefox):
It helps to understand the grid layuot better for a page.

6. Color Gradient:
Grabient: https://www.grabient.com/
Helps developer to choose a better color gradient.
Easing Gradients: https://larsenwork.com/easing-gradients/
A powerful tool to try out color gradients.

7. Shape / Clip Path Editor (FireFox Nightly):

8. Web Font editor (Firefox Nightly):

[CSS] Useful CSS tool for Web designer and developer的更多相关文章
- 使用CSS中的meta实现web定时刷新或跳转的方法
这篇文章主要介绍了使用CSS中的meta实现web定时刷新或跳转的方法,比使用JavaScript脚本实现起来更加简单一些,需要的朋友可以参考下 meta源信息功能之页面定时跳转与刷新 几乎所有的网页 ...
- AdMob设计工具google web designer
一.google web designer工具中文文档: https://support.google.com/webdesigner?hl=zh-Hans#topic=3227692 我用的版本:应 ...
- CSS Sprites (CSS图像拼合技术)教程工具
什么是CSS Sprites? “Sprite”(精灵)这个词在计算机图形学中有它独特的定义,由于游戏.视频等画质越来越高,必须有一种技术可以智能的处理材质和贴图,并且要 同时保持画面流畅.“Spri ...
- CSS:CSS+DIV布局网页
现代网页布局:CSS+DIV: 一般的网页都是顺序布局的,很难达到我们需要的网页布局格式,此时使用DIV进行分层布局,类似于盒子,对每一部分内容进行设计.这是现在主流的网页布局方式,使用DIV+CSS ...
- CSS:CSS 字体
ylbtech-CSS:CSS 字体 1.返回顶部 1. CSS 字体 CSS字体属性定义字体,加粗,大小,文字样式. serif和sans-serif字体之间的区别 在计算机屏幕上,sans-se ...
- CSS:CSS 总结
ylbtech-CSS:CSS 总结 1.返回顶部 1. 你已经学习了CSS,下一步学习什么呢? CSS 总结 本教程已向你讲解了如何创建样式表来同时控制多重页面的样式和布局. 你已经学会如何使用 C ...
- CSS Sprites(CSS图像拼合技术)教程、工具集合
本集合是有一位国外设计师收集整合,并由 oncoding翻译成中文的,感谢他们的辛苦贡献.CSS Sprites技术在国外并不是什么新技术,只不过近两年(尤其08年开始)中国开始流行这个词,大家也开始 ...
- 学无止境的CSS(xHTML+CSS技巧教程资源大全)
本文里面收集一些有关CSS的技巧.教程.工具和观点等,其中一些你也许早就运用的炉火纯青,也可能有的你听都没听说过.不管是新手还是高手,大家都继续学习吧. 一,Web 标准 要玩游戏,就得先了解规则.要 ...
- 43个实例xHTML+CSS(DIV+CSS)网页及导航布局
在中国,很多前端开发初学者都会把xHTML+CSS页面制作说成DIV+CSS,甚至很多人都还不知道xHTML+CSS是什么意思,只知道盲目的追求DIV+CSS,但在国外,是没有DIV+CSS这个概念的 ...
随机推荐
- 函数防抖 debounce
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- python--装饰器2--理解
一.装饰无参函数①.原函数target为无参函数②.装饰函数的内置函数也必须要是无参函数③.运行原理相当于:target()=decorator(target)()---->最后的()相当于执行 ...
- js隐藏元素
js隐藏元素 $("#serviceType").css('display','none'); js显示元素 $("#serviceType3").css('d ...
- Eclipse的properties文件中文乱码解决方法
转自:http://jingyan.baidu.com/article/ed2a5d1f3381d709f6be17f8.html 打开Myeclipse,找到window这一栏,点击Preferen ...
- 20165235 祁瑛 Java第四周考试总结
20165235 祁瑛 Java第四周考试总结 课后习题p29 p45 代码编写 import java.util.*; class Example2_5{ public static void ma ...
- POJ 3104 Drying (经典)【二分答案】
<题目链接> 题目大意: 有一些衣服,每件衣服有一定水量,有一个烘干机,每次可以烘一件衣服,每分钟可以烘掉k滴水.每件衣服没分钟可以自动蒸发掉一滴水,用烘干机烘衣服时不蒸发.问最少需要多少 ...
- 深度学习中的batch_size,iterations,epochs等概念的理解
在自己完成的几个有关深度学习的Demo中,几乎都出现了batch_size,iterations,epochs这些字眼,刚开始我也没在意,觉得Demo能运行就OK了,但随着学习的深入,我就觉得不弄懂这 ...
- Spring AOP 源码分析 - 拦截器链的执行过程
1.简介 本篇文章是 AOP 源码分析系列文章的最后一篇文章,在前面的两篇文章中,我分别介绍了 Spring AOP 是如何为目标 bean 筛选合适的通知器,以及如何创建代理对象的过程.现在我们的得 ...
- macOS packages安装时的降级处理
一.降级安装 在制作macOS的pkg安装包时,一般新发布的程序版本会比旧版本更高.但是有的时候我们也希望在安装的时候,对程序的某些依赖库进行降级安装.比如高版本依赖库中出现了一些Bug,使用旧版本的 ...
- Mysql You can change this value on the server by setting the max_allowed_packet' variable. 异常
MySQL根据配置文件会限制server接受的数据包大小. 有时候大的插入和更新会被max_allowed_packet 参数限制掉,导致失败. 查看目前配置, Windows 系统 配置文件为 my ...