I hope this works. I've tried it a few times and it seems to be accurate. If anyone finds a problem, do let me know. This project gives you a measurement of how similar two colors are in brightness (or as we contrast ratio checkers call, luminance). Set two RGB values in the variables above. The project will give you a contrast ratio. If you want to convert a color from the Scratch costume editor to RGB, try looking for a HSL to RGB converter. I don't have one to reference, sorry. The greater the contrast ratio, the easier the colors are to distinguish apart. Calculating contrast ratios is helpful in finding problematic text and objects in user interfaces. Many people follow the WCAG guidelines for contrast to make their text accessible: AA (minimum contrast): Small text: 4.5 / Large text: 3 AAA (enhanced contrast): Small text: 7 / Large text: 4.5 Large text means at least 18px. Information based off WCAG 2.0. If you want people to be able to easily read text in your projects, follow these guidelines. A lot of you will probably find something that needs a change! This is also why you might be seeing Scratch changing its website design already. If you want to reuse code from the sprite doing the calculations in your projects, feel free to do so, as long as you give credit! Note that the code that processes hex codes only supports 6-digit ones. Also, these guidelines take colorblindness into account! Try getting the contrast to a very low number and you'll notice the borders between the colors become harder to make out. Someone who's colorblind might have even more trouble making them out. To fix this, make sure there's a decent luminance (brightness) difference between any two colors.
