Kleurstops

Kleurstops zijn punten in een verloop (gradient) waarop een specifieke kleur vastligt op een bepaalde positie binnen het verloop. Met meerdere kleurstops ontstaat een geleidelijke overgang van de ene kleur naar de andere. De stops bepalen samen hoe de kleuren zich vermengen over de lengte of straal van het verloop.

Een kleurstop bestaat normaal gesproken uit een kleurwaarde en een positie. De positie wordt doorgaans uitgedrukt in procenten (0% tot 100%) of in relatieve eenheden (0 tot 1). Tussen twee opeenvolgende stops vindt interpolatie plaats, oftewel de kleur wordt geleidelijk gemengd. In veel systemen kan men het kleurbereik of de kleurruimte (bijvoorbeeld sRGB) kiezen, wat van invloed is op hoe de kleuren zich mengen.

Veelgebruikte typen verlopen zijn lineaire verlopen, radiale verlopen en conische verlopen. In CSS- en webontwerp zit de waarde van kleurstops in de gradient-definities, bijvoorbeeld linear-gradient(to right, rood 0%, groen 50%, blauw 100%). Als een positie bij een stop niet is opgegeven, worden de stops meestal gelijkmatig verdeeld over het verloop.

In grafische software zoals Photoshop, Illustrator en GIMP worden kleurstops weergegeven als druppelmarkeringen langs de gradient-editor. Daarnaast kunnen sommige programma’s ook transparantie-stops of opaciteitsgradaties naast kleurstops toepassen, waardoor de mate van doorzichtigheid varieert over het verloop.

Toepassingen van kleurstops liggen onder meer in achtergronden, UI-ontwerp, schaduwen en textuurweergave. Belangrijke aandachtspunten zijn onder meer het vermijden van te veel stops die onduidelijke overgangen veroorzaken, het kiezen van een consistente kleurruimte en rekening houden met contrast en toegankelijkheid. Zie ook gradient, color space en interpolation.