I wanted to add some customisatuon to the highlighting of a site I am developing and I learned one van do this with styling ::selection.
So, just as a test, I picked a dark colour— indigo— and added that as the background -color for ::selection or the highlight colour.
the reason I picked a darkcolour— colour is because I saw that ::selection causes lighter colors to be rendered differently that what the actual colour is. Well, at least in Chrome.
so I think this looks good as the white contrasts the individual, but when images and other elements that the color property does not apply to or hovered on, they are covered.
I removed the styling and saw that chrome handles this by choosing a blue for the highlight colour and giving it some opacity or transparency.
My issue However is that chrome does not say or publish how they get that ::selection or highlight to look that way.
Can someone help me give my custom highlight colour a slight or somethe transparency? Or at least teach me how to edits its opacity so that I can play with until u til I like it?.
If you view the first one in chrome and highlight it
the the highlight colour is a light blue with some transparency. This allows for seeing text and images under the highlight.
If you view the second one in chrome and high light some of the content, The highlight colour ia full indigo. The text can be seen as it has a nice contrast since its colour is forced to be white. But when images are highlighted with that ::selection styling, they are slightly hidden.
However in the first images can be seen as well as text and it looks like there is some transparency in that default blue background colour with the default ::selection styling in chrome.
I want to be able to keep that indigo colour, but lessen the opacity of that fill some.
even if its not supported that well, I want it to look well where it is supported.
I tried to look in the csswg’s site and the w3c’s site, but i can not find an official list for the hex-code-values for the colour-keywords. For example, I wanted to find the hex-code of Indigo so that i could input that in a web-colour-pallet and find the rb value for the css keyword indigo.
The reason I am not putting the hex-code value in Illustrator or Photoshop is because i have been told that they output the wrong rgb values.
Does anyone know where i can find a list of the official hex-code for the css keyword “indigo”? Or even better an official list that has he official and proper rgb value for the css keyword “indigo”?
I cannot decide between the following colours: #4B0082 (indigo) #E6E6FA (lavender-white-colour).
I know this isn’t graphics, but what do you guys think looks better or nicer on a page with a #000 bg and #fff text-colour ?
I didn’t end up using rgba because I didn’t know how to interpret the NaN that the converter put out for indigo as a number and i think the white-ness of the second colour is good enough to see through. What do you guys think?