Picking a color from a webpage is simple. There’s no need to install a Chrome Extension. Simply, open the Elements tab in Chrome Developer Tools.

Open Developer Tools

  • Command+Option+I (Mac) or Control+Shift+I (Windows)

In the styles tab, select any CSS selector that has a color property

  • filter using “color” as search term

Click on the colored box

  • make sure eye dropper is enabled

Return to webpage

  • click on target to find color

Return to Styles section in Developer Tools

  • color should appear with the hex value
  • clicking arrows will switch between hex, RGB values, and HSL (Hue Saturation Luminosity)

Posted in