DEV Community

Aidan
Aidan

Posted on

How to define class name with color code

Image description

I used to be quite confused when naming elements by color code.

Example issues:
This panel default has a background white
<div class="panel">default</div>

This panel default has a background #757575
<div class="panel panel__???">#757575</div>

This panel default has a background #cdcdcd
<div class="panel panel__???">#cdcdcd</div>

OMG! How do I name panel__??? class elements


I recommend https://colors.artyclick.com/color-name-finder/ it solves naming

This case:
This panel default has a background #757575
<div class="panel panel__???">#757575</div>

Solved:
you can reference Name or Similar names
results
<div class="panel panel__boulder">#757575</div>

Image description

Link:
https://colors.artyclick.com/color-name-finder/

Top comments (0)