Hoe te ontwerpen met blauwe en complementaire kleuren

2024 Auteur: Abigail Brown | [email protected]. Laatst gewijzigd: 2023-12-17 06:37

Blauw is een van de meest gebruikte kleuren in webdesign. Het gebruik van medium tot donkerblauw stimuleert een ontspannen gevoel dat ontwerpers kunnen aanvullen met geel en oranje.

Hier zijn een paar verschillende manieren waarop blauw met andere kleuren kan werken.

Tegengestelden trekken aan en blauw past goed bij oranje

Overweeg om blauwe kleuren te combineren met oranje in een complementair kleurenschema.

Van het donkerste tot het lichtste, de sinaasappels die bij elk blauw staal in de bovenstaande afbeelding worden getoond, zijn:

• Hex FFA500 | RGB 255, 165, 0 (een goudoranje; SVG kleur trefwoord & CSS kleur trefwoord oranje)
• Hex FF8000 | RGB 255, 128, 0 (medium oranje)
• Hex FF4500 | RGB 255, 69, 0 (oranje rood; SVG kleur trefwoord oranjerood)
• Hex C83200 | RGB 200, 50, 0 (donkeroranje)
• Nummers: Hex FF7F27 | RGB 255, 127, 39 (perzik oranje)

De blues, van donkerder naar lichter zijn:

1. Marine: Hex 000080 | RGB 0, 0, 128 (CSS kleur trefwoord/SVG kleur trefwoord marine)
2. Blauw: Hex 0000FF | RGB 0, 0, 255 (CSS/SVG-kleursleutelwoord is blauw; browserveilige kleur)
3. Hex: 0045FF | RGB 0, 69, 255 (een medium blauw)
4. Staalblauw: Hex 4682B4 | RGB 70, 130, 180 (SVG-kleur trefwoord staalblauw; een bedrijfsblauw)
5. Hex: 0080FF | RGB 0, 128, 255 (een medium blauw)
6. Lichtblauw: Hex ADD8E6 | RGB 173, 216, 230 (SVG-kleur trefwoord lichtblauw)

Donkerblauw en middelblauwe tinten symboliseren belangrijkheid, vertrouwen, macht, intelligentie, stabiliteit, eenheid en conservatisme. Door wat oranje toe te voegen aan je overwegend donkerblauwe palet, introduceer je wat warmte en energie die ervoor kunnen zorgen dat je palet niet te hoogdravend of overweldigend wordt.

Je hoeft deze exacte tinten niet te gebruiken. Ga een tikje lichter of donkerder, of stap één plek naar links of rechts op het kleurenwiel. Deze kleurencombinaties helpen u een geschikt kleurenpalet te vinden met blauw en oranje als hoofdcomponenten.

Mix diepe blues met goudgeel

Neem donkerblauw naar bijna paars en voeg een scheutje zonnegeel toe in een complementair kleurenschema.

Blauw is een koele kleur die overgaat in warm als je de paarsachtige tinten toevoegt, terwijl geel een warme kleur is aan de andere kant van het kleurenwiel. Vermijd het gebruik in gelijke hoeveelheden om onaangename trillingen te voorkomen. Fleur je blauw op met een vleugje geel (of kalmeer je geel met een vleugje blauw).

Van het donkerste tot het lichtste, het geel dat wordt weergegeven bij elk blauw staal in de bovenstaande afbeelding is:

• Cadium Geel: Hex FF9912 | RGB 255, 153, 18 (een warm, bruingeel)
• Goud: Hex FFD700 | RGB 255, 215, 0 (SVG kleur trefwoord goud)
• Nummers: Hex FFFF00 | RGB 255, 255, 0 (SVG/CSS kleur trefwoord geel)

De blues is:

1. Zeer donkerblauw: Hex 000033 | RGB 0, 0, 51 (een browserveilig donkerblauw)
2. Midnight Blue: Hex 191970 | RGB 25, 25, 112 (SVG kleur trefwoord middernachtblauw)
3. Dark Slate Blue: Hex 483D8B RGB 72, 61, 139 (SVG-kleursleutelwoord darkslateblue; een grijs-paars blauw)
4. Indigo: Hex 4B0082 | RGB 75, 0, 130 (SVG kleur trefwoord indigo; een paarsachtig blauw)
5. Blauw Violet: Hex 8A2BE2 | RGB 138, 43, 226 (SVG kleur trefwoord blauwviolet)
6. Kob altblauw: Hex 3D59AB | RGB 61, 89, 171

Kleuren die naar de violet-paarse kant van blauw duwen, kunnen een vleugje mysterie toevoegen, hints van vrouwelijkheid. Het voegt warmte toe aan het koele blauw.

Cyaantinten met donkeroranje

Gemiddeld tot donker cyaan is blauw op de rand van groen. Hier worden verschillende mediumblauwe en cyaantinten gecombineerd met donkerbruin-oranje kleuren.

Naast zijn kalmerende eigenschappen, kan deze donkerdere tint blauw de symboliek van groen dragen, zoals balans, harmonie en stabiliteit. Het krijgt een beetje warmte en energie wanneer het wordt gecombineerd met bruinachtige of roodachtige tinten oranje. Bruin is een natuurlijke, nuchtere neutrale kleur. Rood en cyaan zijn tegenpolen op het kleurenwiel met een hoog contrast, maar ze zijn niet per se een geweldige combinatie. De overgang van rood naar oranje en donkerdere blauwtinten zorgt voor een aangenamer palet.

Van het donkerste tot het lichtste, de rood-oranje die bij elk blauw staal in de bovenstaande afbeelding wordt getoond, zijn:

• Diep oranje rood: Hex CD3700 | RGB 205, 55, 0
• Cadmium Oranje: Hex FF6103 | RGB 255, 97, 3
• Nummers: Rode Hex FF0000 | RGB 255, 0, 0 (SVG/CSS kleur trefwoord rood)

De blues is:

1. Donker koningsblauw: Hex 27408B | RGB 39, 64, 139
2. Deep Sky Blue: Hex 00688B | RGB 0, 104, 139 (not kleur trefwoord deepskyblue)
3. Dark Slate Blue: Hex 2F4F4F RGB 47, 79, 79 (not color keyword darkslateblue)
4. Donkercyaan: Hex 008B8B | RGB 0, 139, 139 (de groenere kant van blauw)
5. Mangaanblauw: Hex 03A89E | RGB 3, 168, 158 (een blauwe turquoise kleur)
6. Cyaan (Aqua): Hex 00FFFF | RGB 0, 255, 255 (SVG-kleursleutelwoord cyaan of aqua; een blauwgroene kleur)

Blauw, Rood en Geel

Een gesplitste complementaire triade neemt één kleur (in dit geval blauw) en pakt dan de kleuren aan weerszijden van het complement van die kleur (tegengestelde kleur op het kleurenwiel). Het complement van puur blauw is puur geel. Middenblauw is tegenover oranje. Afhankelijk van met welke tint blauw je begint en hoeveel tussenkleuren je doorloopt, kun je deze matchen met kleuren van rozerood tot geelgroen.

1. Marine: Hex 000080 | RGB 0, 0, 128
2. Helder Rood: Hex FE0004 | RGB 254, 0, 4
3. Sunny Yellow: Hex FFFB00 | RGB 255, 251, 0
4. Dark Slate Blue: Hex 483D8B RGB 72, 61, 139 (SVG-kleursleutelwoord donker slate blue; een grijs-paars blauw)
5. Goud: Hex FFD700 | RGB 255, 215, 0 (SVG kleur trefwoord goud)
6. Chartreuse: Hex 7FFF00 | RGB 127, 255, 0
7. Donkercyaan: Hex 008B8B | RGB 0, 139, 139 (de groenere kant van blauw)
8. Violet-Rood: Hex D02090 | RGB 208, 32, 144
9. Donkeroranje: Hex C83200 | RGB 200, 50, 0 (not kleur trefwoord donkeroranje)

Donkere tinten blauw duiden op belangrijkheid, vertrouwen, macht, autoriteit, intelligentie, stabiliteit, eenheid en conservatisme. Rood is een andere krachtige kleur, maar het trekt meer de aandacht dan blauw. Geel voegt wat helderheid en vreugde toe. Het gebruik van gelijke hoeveelheden van elke kleur zou het kinderlijk maken (denk aan primaire kleuren), zoals voorbeeld 1. Als je echter alleen kleine doses van de rode en gele (of nabijgelegen kleuren) gebruikt met een voornamelijk donkerblauw kleurenschema, is het redelijk geschikt voor projecten voor volwassenen waarbij je niet te serieus wilt lijken.