Op deze pagina komt de samenvatting van de kleurentheorie in P5JS Unit 1.
- Probeer de kleurenmenger van Informatica-Actief
- In P5JS. RGB: Unit 1 LA 3.1 en HSB: Unit 1 LA 3.2
- In p5JS wissel je met colorMode(HSB) of colorMode(RGB). Uitleg
RGB Kleuren
- Rood, Groen, Blauw
- Allemaal: een getal tussen
0-255 - Kleuren van het licht.
- Alle kleuren samen geeft wit
- Alle kleuren uit geeft zwart
- De technische kleuren van de binnenkant van een LCD-Scherm, Camera, etc
- Alle getallen met een R=G=B geeft een bepaalde grijstint
HSB Kleuren
- Hue Saturation Brightness
- Variant: Hue Saturation Value
- Hue : Tint. De kleur van de verfkorrels.
0-360. Denk kleurencirkel - Saturation: Verzadiging. Hoeveel van deze verfkorrels versus de grijze massa.
0-100 - Value / Brightness: De kleur lamp die je met H en S hebt, kan ook uit, half aan, of aan.
0-100 - Uitleg met plaatjes op https://www.learnui.design/blog/the-hsb-color-system-practicioners-primer.html
- HSB-kleuren zijn beter te begrijpen voor mensen dan de technisch georienteerde RGB-kleuren.
Hex getallen
- Een hexadecimaal getal is gecodeerd in het 16-tallig stelsel. Maar we hebben maar 0-9 = 10 cijfers. Dus ABCDEF zijn de getallen 10 tm 15.
- Hex getallen worden aangegeven met #
- Getallen tot #FF ofwel tot 255 moet je kunnen omrekenen in 2 richtingen.
| Decimaal | Hexadecimaal | |
| 0 | #0 | En die ertussen ook zo |
| 9 | #9 | |
| 10 | #A | |
| 11 | #B | |
| 12 | #C | |
| 13 | #D | |
| 14 | #E | |
| 15 | #F | |
| 16 | #10 | Na 15 slaat ‘ie om, net als van 9 naar 10 in decimaal. |
| 255 | #FF |
Hex Kleuren
- RGB Kleuren
- R G en B elk 0-255
- Maar dan gecodeerd in Hex
- Hex getallen worden aangegeven met een #
| Hex Code | Red | Green | Blue | Geeft |
| #000000 | 0 | 0 | 0 | Black |
| #0000FF | 0 | 0 | 255 | Blue |
| #00FF00 | 0 | 255 | 0 | Green |
| #FF0000 | 255 | 0 | 0 | Red |
| #00FFFF | 255 | 255 | 0 | Cyan |
| #FF00FF | 255 | 0 | 255 | Magenta |
| #FFFF00 | 255 | 255 | 0 | Yellow |
| #FFFFFF | 255 | 255 | 255 | White |
| #D3D3D3 | 211 | 211 | 211 | Light Grey |
| #808080 | 128 | 128 | 128 | Grey |
maar niet uit het hoofd ophoesten.
Alpha Value
De Alpha is de mate van transparantie van een kleur. Dit is ook een getal 0-1 of soms gecodeerd op een range 0-255.
De Alpha:
- geeft de transparantie van een kleur.
- in RGB krijg je dan een extra kanaal: RGBA
- in HSB krijg je een extra kanaal: HSBA
- De waarde is tussen 0 en 1
- 0 is onzichtbaar
- 1 is volledig solid
- Soms genoteerd als tussen 0 en 255
- Het gevolg is dat je de vorm achter deze nog gedeeltelijk kunt zien.
- Bestaat ook in CSS, Photoshop, Illustrator e.d.
