color-interpolation-filters

Baseline 已广泛支持

此特性已相当成熟，可在许多设备和浏览器版本上使用。自 ⁨2020 年 1 月⁩ 起，所有主流浏览器均已支持。

color-interpolation-filters CSS 属性指定通过 SVG 滤镜效果执行的图像操作的色彩空间。如果明确声明，CSS 属性的值将覆盖元素 color-interpolation-filters 属性中给出的任何值。

注意： color-interpolation-filters 属性仅与 SVG 滤镜操作相关。它对 <feOffset>、<feImage>、<feTile> 和 <feFlood> 等滤镜原语没有影响，而是适用于各种滤镜效果元素（例如 <feBlend>）；有关完整列表，请参见 SVG color-interpolation-filters 页面。

注意： 重要的是要记住，SVG color-interpolation 属性的初始值为 sRGB，而 color-interpolation-filters 的初始值为 linearRGB。这意味着，在默认情况下，滤镜效果插值与所有其他颜色插值在不同的色彩空间中发生。

语法

css

color-interpolation-filters: auto;
color-interpolation-filters: linearRGB;
color-interpolation-filters: sRGB;

/* Global values */
color-interpolation-filters: inherit;
color-interpolation-filters: initial;
color-interpolation-filters: revert;
color-interpolation-filters: revert-layer;
color-interpolation-filters: unset;

值

linearRGB: 指示颜色插值应在 sRGB 规范中描述的线性化 RGB 色彩空间中进行。这是默认属性值。
sRGB: 指示颜色插值应在伽马编码的 sRGB 色彩空间中进行。
auto: 指示用户代理可以选择 sRGB 或 linearRGB 空间进行颜色插值。此选项表明作者不要求颜色插值发生在特定的色彩空间中。

正式定义

初始值	`linearRGB`
应用于	在 `<svg>` 中控制 `<filter>` 元素输出的元素集。
继承性	是
计算值	同指定值
动画类型	离散

正式语法

color-interpolation-filters = 
  auto       |
  sRGB       |
  linearRGB

规范

规范
滤镜效果模块第 1 级 # ColorInterpolationFiltersProperty

浏览器兼容性

另见

帮助改进 MDN

了解如何贡献

本页面由 MDN 贡献者最后修改于 2025 年 7 月 14 日。

在 GitHub 上查看此页面 • 报告此内容存在的问题