COLOR CRICKET / How-To
Van eerste kleur naar klaar ontwerp.
Volg deze stappen. Alles wat je maakt in de werkbank wordt op je eigen apparaat verwerkt.
Kies je basiskleur
1. Open de generator en kies het tabblad Harmonie. 2. Klik op het basiskleurvakje naast de harmoniekeuze om de kleurenkiezer te openen. 3. Vul een HEX-code in, bijvoorbeeld #F4C430, als je al een huisstijlkleur hebt. Kies anders een tint en pas het kleurvlak en de schuifregelaars aan. 4. Bekijk hoe de vijf paletkleuren veranderen wanneer je de basiskleur aanpast. Sluit de kleurenkiezer om het geheel te bekijken. 5. Probeer een andere harmonie voor nieuwe combinaties met je basiskleur. Kopieer of exporteer een resultaat dat je wilt bewaren voordat je een nieuw palet genereert.
Kies een kleurharmonie
1. Kies een basiskleur en open de dropdown Harmonie. 2. Kies Analoog voor tinten die dicht bij elkaar liggen: een goed begin voor een rustig, samenhangend ontwerp. 3. Kies Complementair voor tinten die tegenover elkaar liggen op de kleurencirkel wanneer je meer contrast wilt. 4. Kies Triade voor een combinatie op basis van drie gelijkmatig verdeelde tinten. Vergelijk het resultaat in het palet en de gradientvoorvertoning. 5. Klik op Nieuw palet om met dezelfde harmonie een nieuwe basiskleur te proberen. Dit vervangt het huidige palet. 6. Je kunt ook beginnen met een voorbeeldpalet onder de editor. Filter de voorbeelden en klik op een palet om het te laden. Pas daarna losse kleuren aan.
Pas je kleuren aan
1. Zoek tussen de vijf kleurvlakken de kleur die je wilt wijzigen. 2. Klik op de HEX-waarde, vervang deze door een geldige code zoals #F4C430 en druk op Enter of klik buiten het veld. 3. Klik voor visueel aanpassen op het potlood en gebruik de kleurenkiezer. Bekijk hoe het kleurvlak en de gekoppelde gradientkleuren veranderen. 4. Herhaal dit voor andere kleurvlakken. Handmatig aangepaste kleuren vormen een vrij palet en hoeven niet meer aan een harmonieregel te voldoen. 5. Klik op het kopieericoon van een kleurvlak om die losse HEX-kleur te kopiëren. Gebruik Exporteer en kies een formaat om alle kleuren in RGB of HSL te kopiëren. 6. Bewaar een paletlink of exporteer je kleuren voordat je een nieuw ontwerp probeert. Controleer de leesbaarheid van tekst in het ontwerp waarin je de kleuren gebruikt.
Haal kleuren uit een foto
1. Open het tabblad Uit een foto in de generator. 2. Selecteer een JPG-, PNG- of WebP-afbeelding op je apparaat of sleep deze naar het uploadvak. De maximale bestandsgrootte is 20 MB. 3. Wacht tot de verwerking klaar is. Color Cricket maakt een palet met vijf representatieve kleuren uit de afbeelding. 4. Vergelijk de kleuren met je foto. Het palet is een uitgangspunt en bevat mogelijk niet alle kleine details van de afbeelding. 5. Pas een HEX-waarde aan of open de kleurenkiezer van een kleurvlak om het resultaat te verfijnen. Gebruik de kleuren eventueel in de gradient-editor. 6. Exporteer het palet of bewaar een deellink. De foto wordt op je apparaat verwerkt en wordt niet in de deellink opgenomen.
Bouw je gradient
1. Genereer een palet, kies een voorbeeld of haal kleuren uit een foto. 2. Kies bij de gradientinstellingen Lineair voor een overgang in één richting of Radiaal voor een overgang vanuit het midden. 3. Pas bij een lineaire gradient de hoek aan. Met 90° loopt de overgang bijvoorbeeld van links naar rechts. Bekijk tijdens het aanpassen de voorvertoning. 4. Sleep de kleurstops over de balk of vul hun posities in procenten in om te bepalen waar elke kleur verschijnt. 5. Wijzig de kleur van een stop, voeg een stop toe met de plusknop of verwijder een ongewenste stop. Een gradient kan twee tot acht stops bevatten. 6. Controleer de voorvertoning en klik op CSS kopiëren. Plak de code in de CSS-regel van je element en controleer het resultaat op het formaat dat het op je website krijgt.
Exporteer je ontwerp
1. Maak het palet of de gradient af die je wilt gebruiken. 2. Klik voor een palet als tekst op Exporteer en kies HEX, RGB, HSL of CSS. Controleer de getoonde waarden. 3. Klik op Kopiëren om de tekst elders te gebruiken of op Downloaden om deze als bestand te bewaren. 4. Gebruik voor een gradient op een website CSS kopiëren in het gradientgedeelte. Daarmee kopieer je de gradientcode in plaats van de kleurenlijst van het palet. 5. Klik voor een afbeelding op Afbeelding, kies Palet of Gradient en selecteer PNG, WebP of SVG. Controleer de voorvertoning en klik op Downloaden. Het exportformaat is 1200 × 630. 6. Je kunt een afbeelding ook kopiëren of delen wanneer je browser dit ondersteunt. Is dat niet beschikbaar, dan biedt Color Cricket daarvoor een PNG-download aan.
Deel en werk verder
1. Maak je palet en gradient af en klik bovenaan de generator op Deel palet. 2. Kopieer de link in het deelvenster. Deze bevat de instellingen van je palet en gradient, waaronder kleuren en stopposities. 3. Plak de link in een bericht of bewaar deze als bladwijzer. Wie de link opent, kan het ontwerp bekijken en verder bewerken. 4. De oorspronkelijke foto staat niet in de link. Deel die apart als iemand de foto nodig heeft. 5. Gebruik de knoppen voor Facebook, WhatsApp, e-mail of andere deelopties onderaan om Color Cricket zelf te delen. Deze knoppen delen de pagina, niet je huidige ontwerp. 6. Bewaar je paletlink of een exportbestand voordat je de pagina verlaat. Color Cricket slaat ontwerpen niet op in een online account.
