![]() ![]() A secondary colour is a color made by mixing of two primary colours in a given colour space. As the shift toward CSS custom properties happens, I think having a -c-orange and -c-gray-5 is similarly appropriate. Read Tools The basic colors of pigments: primary cyan, magenta, and yellow, blended to form secondary red, green, and blue. The primary colors are Cyan, Magenta, and Yellow. The CMY (K) Color Wheel The CMY (K) (Cyan, Magenta, Yellow) represent the colors used to print on paper. I’ve largely stuck with that just-use-color-names approach today in Sass. RGB Green is different from the HTML color named Green. Namespacing like $-c-orange is probably an easier approach if you need to do anything at all. In a similar fashion, I’ve tried keeping colors within a Sass map, like: $colors: (īut the only vague goal there was to clean up the global namespace, which probably isn’t worth the hassle of needing to map-get all the time. After all, this isn’t crossing the HTML-CSS boundary here this is all within CSS and developer-only-facing, which puts more of a narrow scope on the problem. I found that to be much more intuitive with little if any negative side effects. Later, in a “screw it” moment, I named colors more like… $orange: #F060D6 So, I tried to make my colors semantic, in a sense - what they represent not what they literally are: $mainBrandColor: #F060D6 īut I found that I absolutely never remembered them and had to constantly refer to where I defined them in order to use them. It’s better for the to reflect it what it is than what it looks like. header-blue-left-bottom because the color and position of that element might change. From my naming-things-in-HTML skillz, I knew to avoid classes like. The first thing I wanted to do was variablize my colors. I remember the very first time I tried Sass on a project. Secondary colours are made by mixing equal amounts of primary colours together: Blue and red mixed together make purple Yellow and red mixed together make orange Blue and yellow mixed together. ![]() I’ve tried all of the following, and I have yet to succeed at writing CSS that works well with any color scheme. A shade is a hue to which black has been added. You'll begin to drill down and impress yourself, by describing the color something like this: 'The color has a Yellow Hue, leaning strongly toward Green.' Indeed this clarifies that the mixture began with the Primary Yellow, and gradually added the Secondary color Green. A tint is a hue to which white has been added. Before long you'll find it easy to identify the Hue more specifically. Have you succeeded at writing CSS that uses color variables in a manner agnostic to the colors they represent? Simply put, tints, tones and shades are variations of hues, or colors, on the color wheel. What naming scheme do you use for color variables? ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |