Color Name Tooltip

Compatible with Chrome and Edge

Instruction Guide
We have a simple tutorial guide which explains the features of the software extension and what each button inside the extension does. Read our tutorial and welcome guide on how to use the extension to the fullest. Use all the features of this browser software.
If you are interested in other web extensions to install, you might wish to check out the Microsoft Bing Search with Rewards extension.

Microsoft Bing Search with Rewards Extension

It allows you to complete daily offers to get points.
Track the number of points you have currently and the rewards you can redeem with these points.
The ways to get points & get rewarded is search with Bing, browse with Microsoft Edge and shop at the Microsoft and Windows stores to earn rewards.



Other useful extensions

Another extension which would be useful to install is the iCloud bookmarks extension.
It allows to keep your Chrome bookmarks on Windows synced up with the Safari bookmarks on your iPhone, iPad, and Mac.
iCloud will store your website bookmarks so it is accessible even on your iPhone and Mac.
Try these other two extensions and see if it will boost your daily productivity.

How to use

Work with Drive

Features:

Color Name Tooltip - The Ultimate Web Color Discovery Tool

Overview

Are you a designer, developer, or digital artist who constantly finds themselves wondering about the exact shades used on the web? Or perhaps you are one of the millions of people worldwide who experience some form of color vision deficiency and struggle to distinguish between similar hues? Welcome to Color Name Tooltip, a powerful yet lightweight Chrome extension designed to bring clarity, precision, and accessibility to your web browsing experience.

Color Name Tooltip is not just another color picker. It is an intelligent, real-time color identification engine that lives right in your browser. By simply hovering your mouse over any element on any webpage, you can instantly see the computed CSS color values in multiple formats, along with a human-readable name that makes sense to everyone.

Why Color Name Tooltip?

The web is a vibrant place, but the technical side of color can be intimidating. Hex codes like #F08080 or RGB values like (240, 128, 128) don't mean much to the average person. Even for seasoned professionals, it's hard to visualize the exact shade from a string of numbers.

This is where Color Name Tooltip shines. It bridges the gap between technical data and human language. When you hover over an element, it doesn't just tell you the math; it tells you the story. It identifies the color as "Light Coral," giving you an immediate mental image of the shade.

Key Features

1. Instant Hover Identification

No need to open developer tools or click on an element. Just move your cursor across the screen, and the tooltip follows, updating instantly as you glide over different colors. Whether it’s a background, a border, or text, Color Name Tooltip finds the computed color and displays it elegantly.

2. Comprehensive Color Data

For the pros, we provide all the essential technical details:

  • Hexadecimal: The industry standard for web design.
  • RGB (Red, Green, Blue): Essential for many design applications and CSS.
  • HSL (Hue, Saturation, Lightness): Often the most intuitive way for designers to understand and manipulate color.

3. Nearest CSS Named Color

Ever wanted to know what the closest "official" CSS color name is? Our extension compares the hovered color against the standard set of 140+ CSS named colors and tells you the closest match. This is incredibly useful for developers who want to use standard names in their stylesheets for better readability.

4. Advanced Plain English Descriptions (ntc.js)

This is the heart of our extension's accessibility. We've bundled a massive lookup table containing over 1,500 color classifications. Instead of generic names, you get descriptive, evocative titles like 'medium coral pink', 'dark navy blue', or 'dusty lavender'. These names are derived from the famous "Name That Color" (ntc) algorithm, providing a level of detail that standard pickers simply can't match.

5. Designed for Accessibility

Color Name Tooltip was built with color-blind users in mind. Color vision deficiency can make navigating the web a challenge, especially when color is used to convey meaning or distinguish between sections. By providing clear, written names for every color, we empower users to understand the visual hierarchy and aesthetic choices of any website, regardless of their color perception.

How It Works

Under the hood, Color Name Tooltip uses sophisticated logic to determine the "computed style" of the elements you hover over. It intelligently identifies whether to show the background color or the text color based on what's most prominent under your cursor. The data is then processed through our bundled libraries—ntc.js for the plain English names and css_colors.js for the standard CSS matches—to provide you with a comprehensive profile of the color in milliseconds.

Minimalist and Non-Intrusive

We believe that tools should stay out of your way until you need them. Color Name Tooltip features:

  • Clean UI: A modern, semi-transparent tooltip that doesn't obscure your view.
  • Smart Positioning: The tooltip automatically repositions itself to ensure it always stays within the browser viewport.
  • Toggle Control: Need a break? You can easily enable or disable the tooltip through the extension's popup menu. It’s there when you need it and gone when you don’t.

Perfect For:

  • Web Designers: Quickly reference colors on inspiration sites without diving into the code.
  • Frontend Developers: Verify that the colors on the live site match the design specifications.
  • Digital Artists: Expand your color vocabulary by seeing the names of the shades you encounter.
  • Accessibility Advocates: Ensure your sites are understandable for all users by checking how colors are described.
  • Color-Blind Individuals: Gain a new level of independence in exploring the visual web.

Privacy and Performance

Your privacy is our priority. Color Name Tooltip operates entirely locally within your browser. It does not track your browsing history, collect personal data, or communicate with external servers. It is also highly optimized for performance, ensuring that your browsing experience remains smooth and responsive even on complex, color-rich websites.

Join the Community

We are committed to making Color Name Tooltip the best color utility on the web. If you have suggestions for new features, encounter any issues, or just want to share how the extension has helped you, we’d love to hear from you! Your feedback drives our development.

Install Color Name Tooltip today and see the web in a whole new light—with names!

Tutorial:

  1. Install the Extension
  2. After installing the extension, click on the icon on the toolbar.