Google Chrome DevTools 中有吸管工具吗？

Question

我想使用 Google Chrome 的 DevTools 从网站获取颜色。

我知道如果在 CSS 中设置了颜色代码，您可以获得颜色代码，但我想从图像中获取颜色。

这可以通过 google Chrome 的 DevTools 实现吗？

Answer 1

1. 检查 DOM 树中的节点。

   

2. 单击其

   color

   属性以打开颜色选择器。 向节点添加一个

   color

   属性（如果节点没有）。

   

3. 将鼠标悬停在视口上。

   

4. 将鼠标悬停在要采样的颜色上时单击。

Answer 2

使用EyeDropper API

1. Option + ⌘ + J (macOS) 或 Shift + CTRL + J (Windows/Linux)。

2. await new EyeDropper().open();

3. 将鼠标悬停在您想要的颜色上并点击它
4. 十六进制值将打印到控制台中。

来源