Making A Desktop Color Eyedropper in Python to Grab Color Values

Goal: recreate my resume in the dark Atom text editor theme (background and fonts).
Sub-goal: find a color eyedropper to grab the actual color values of the Atom layout.

Approach #1: find an Atom eyedropper package to grab the colors.

My first thought was to find the easiest solution, within the packages of my Atom text editor. After searching Atom’s packages, the two best potential solutions were an-color-eyedropper and color picker. The an-color-eyedropper description sounds perfect: “A simple “real” color picker. By “real” I mean it’s able to pick colors anywhere on any screen.” Unfortunately it failed to install and displayed the error, “Unable to download 400 Bad Request Repository inaccessible”. It seems to rely on the “python” Atom package which is now deprecated (script is its successor). I was unable to find a repo anywhere by googling.

Color picker has easy-to-follow instructions and installed with no problem. It allows you to quickly select any color visually with sliders. Then the RGB or Hexadecimal values of your color are added as text in the editor in proper format. However, we are looking for a color grabber to pull colors from a screen object. This is more of a productivity enhancing and color exploration tool for programmers. On to Python options.

Approach #2: Use the python tkcolorpicker package to grab the colors.

The first thing I found on Google was tkcolorpicker, a package that uses the tkinter library. I couldn’t tell exactly what it was, so let’s find out. First, install via pip:
python -m pip install tkcolorpicker

Then run the below script. Cool gadget for sure, but also not quite what I was looking to use. It allows selection of a color with sliders or input values, similar to Atom’s color picker, but for user input rather than color picking. Nice little tool. 😀
color_picker_gui

import tkinter as tk
import tkinter.ttk as ttk
from tkcolorpicker import askcolor

root = tk.Tk()
style = ttk.Style(root)
style.theme_use('clam')
hex_code, RGB_code = askcolor((255, 255, 0), root) 
print(hex_code, RGB_code)
root.mainloop()

askcolor() returns a tuple with both the RGB and hex codes selected by the user. Above, we are unpacking that tuple into the hex_code and RGB_code variables.

Approach #3: Use the Python eyedropper package to grab the colors.

I then found eyedropper for Windows, which has a minimalist repository and offers a simple approach to desktop eyedropper functionality. Install eyedropper via pip: python -m pip install eyedropper

pyeyedropper_start

Hover your mouse over the object you want to grab the color from (in my case, the Atom text editor background). Then following these instructions:

Alternatively, I was able to run eyedropper from the command line by entering: py -m eyedropper

pasted_hex2

CCvOYFiUgAA4DJd

Mission possible. Then I hit ctrl+v in a text file and there was the hex code for my Atom background. Some of the colors that eyedropper grabbed were nearly identical to those in the Atom text editor dark theme. Others were not quite the same. I made slight eyeball adjustments to the colors for some of the fonts.

Here’s the end result: See My Resume via Dropbox 😀

Why not use Python to convert hex to RGB?

Microsoft Word uses RGB codes but eyedropper gave us hex. To convert, I found this website practical and quick.

Alternatively, you could convert a hex code to RGB with python:

hex_code = input('Enter hex: ').lstrip('#')
RGB_code = tuple(int(hex_code[i:i+2], 16) for i in (0, 2, 4))
print('RGB =', RGB_code)

rgb_to_hex

What the hay, let’s use pd.read_clipboard() to get the hex codes.

Once eyedropper sends the color values to your system’s clipboard, there are multiple ways to access them. This alternative uses pandas.

Installing pandas and pyperclip with pip:

python -m pip install pandas
python -m pip install pyperclip

On Linux, install xclip or xsel: sudo apt-get install xclip

To get the clipboard contents with pandas:

import pandas as pd
hex_code_df = pd.read_clipboard() 
print(hex_code_df.head())

Supplementary Notes and Links

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.