CSS filter 属性为元素应用视觉效果——模糊、亮度、对比度和颜色调整，作用于图片、背景甚至视频。与图像编辑器不同，滤镜在浏览器中运行，任何分辨率下都保持清晰，还能与过渡动画流畅结合。
常见问题
Q: CSS 有哪些滤镜函数？
CSS 有哪些滤镜函数？blur()、brightness()、contrast()、grayscale()、hue-rotate()、invert()、opacity()、saturate()、sepia() 和 drop-shadow()。一条 filter 属性可链任意数量。
Q: CSS filter 是 GPU 加速的吗？
CSS filter 是 GPU 加速的吗？是。大多数滤镜函数在 GPU 上运行，以 60fps 动画。blur() 和 drop-shadow() 最重，大元素上要节制使用。
Q: filter 影响布局吗？
filter 影响布局吗？不影响。滤镜纯视觉——元素在文档流中保持原始尺寸和位置。尺寸变化用 transform。
Q: 滤镜能动画吗？
滤镜能动画吗？能。对 filter 属性做 transition 或 keyframes 动画。相同长度的不同滤镜链之间插值平滑。
Q: 怎么做图片灰度、悬停上色？
怎么做图片灰度、悬停上色？两个状态：img { filter: grayscale(100%); transition: filter .4s; } 和 img:hover { filter: grayscale(0); }。经典的作品集模式。
中国传统色
中国传统色源自「五色观」——青、赤、黄、白、黑，对应五行、方位与季节。古人从矿物与植物中提炼颜料，形成了数百种富有诗意的色名。这些色彩被广泛用于宫廷服饰、建筑彩绘与书画创作，至今仍是设计师的灵感源泉。
胭脂 #9D2933古代妆饰与衣料的经典红色，由胭脂虫或红花制成
朱砂 #FF461F矿物颜料，故宫红墙与印章的常用色
竹青 #789262竹叶之色，文人雅士钟爱的清雅色调
月白 #D6ECF0月光般的淡蓝色，明清宫廷常服用色
藤黄 #FFB61E取自藤本植物汁液，国画重要黄色颜料
石绿 #16A951矿物孔雀石研磨而成，山水画中的绿色
墨色 #50616D书法用墨的深灰蓝色，文房四宝之色
Q: 什么是中国传统色？
什么是中国传统色？中国传统色源自「五色观」——青、赤、黄、白、黑对应五行与方位。古人从朱砂、藤黄、石绿等矿物植物中提取颜料，形成了数百种如「月白」「黛蓝」般富有诗意的色名。
Q: 中国红是什么色值？
中国红是什么色值？中国红属于朱砂色系，常用色值 #FF461F（朱红）或 #9D2933（胭脂）。故宫红墙更接近深红色 #A61B29。