Update Dec 21, 2015
The description is below this tool
color keywords
Click the search option first.
That is the list of keywords for defining web color. Useful for coloring any style-able HTML
element with CSS
. So, instead of typing rgb
, or hex
value, we can use these keywords below.
The tool above has two options for searching the CSS
color keywords.
- Find abnormally
- For example,
you type a, then every keyword containing the letter a will be shown. - Another example,
type the word green, then every color keyword that has the word fragment green in it will be returned.
- For example,
- Search normally (from the beginning of the keyword)
It's a common method in browser. It will check the character starting from the front of the keyword then return any matching keyword(s).
This will be regularly updated if there's new color keyword(s) - in CSS4
maybe.
Using the Search Function Above
- Hit either option to enable search
input
.The dark colored option means the method is inactive.
The light colored one is the chosen search method (active). - Type the query on the
input
. - You can see the color code in
hex
andrgb
and see it on wider area by clicking either button on the right. - Reset by emptying the
input
or switching the search option or just clicking the current search option.
This user interface we created is better viewed on desktop. But it will also fit the mobile device screenthough a bit weird.
Application/Page Updates
Dec 21, 2015
- Removed the auto-scroll on search option click and input.
Dec 20, 2015
- Switched the description to the bottom of the tool.
- Added hyperlinks to jump around.
- Added related tools links on the bottom.
Oct 15, 2015
- Lowered the
opacity
for other inactive color swatches. - Updated the "abnormal" search. Somebody forgot to update the
HTML
attributes. It's fixed now.
Sep 4, 2015
- Added RESET BG COLOR feature to manually reset the background color test and the search box input text.
Aug 10, 2015
- Added
opacity
changes.
June 14, 2015
- Added "jump to top" behavior on search bar type/paste event.
- Added random word for
button[disabled]
. - Changed the limit position for
scrollTop
.
June 12, 2015
- Added jump button to search bar.
- It's using slightly different output layout.
- The main "magic" is translated to plain JavaScript.
- Added
rebeccapurple
keyword.
Related to Color and CSS
More Reading
CSS Color Module Level 3 at W3C