Coolors - Színpaletta generátor
A Coolors a leggyorsabb és legintuitívabb színpaletta generátor designerek, fejlesztők és kreatívok számára. Naponta 50 000+ paletta készül a platformon.
Miért válaszd a Coolors-t?
- Villámgyors - Space billentyűvel instant új paletta
- AI funkciók - Intelligens színjavaslatok
- Integráció - Figma, Adobe, Chrome extension
- 10M+ paletta - Böngészhető közösségi gyűjtemény
Főbb funkciók
Paletta generálás
- Space billentyű - Új paletta generálása egyetlen gombnyomással
- Színzárolás - Tetszett szín megtartása, többi cseréje
- Harmónia alapú - Színelmélet algoritmusok
- 5 színű paletták - Optimális mennyiség
Színkezelés
- Többféle formátum - HEX, RGB, CMYK, HSB, LAB
- Színkönyvtárak - Pantone®, Copic® támogatás
- Shades & Tints - Árnyalatok generálása
- Color blindness - Színvakság szimuláció
AI funkciók
- Smart suggestions - AI alapú színjavaslatok
- Image extraction - Színek kinyerése képekből
- Palette from photo - Képből paletta készítése
Export és integráció
- PDF export - Nyomtatásra kész
- Code export - CSS, SCSS, Swift, stb.
- URL megosztás - Egyedi link minden palettához
- Integrációk - Figma, Adobe, Böngésző
Használat
Webes verzió
- Látogass el: coolors.co/generate
- Nyomj Space-t új palettához
- Kattints a lakat ikonra tetszett színnél
- Ismételd amíg elégedett nem leszel
Billentyűkombinációk
| Billentyű | Funkció |
|---|---|
Space | Új paletta generálása |
L | Szín zárolása/feloldása |
C | Szín másolása |
S | Paletta mentése |
E | Paletta exportálása |
A | Alternatív árnyalatok |
Szín módosítása
- Kattints egy színre
- Használd a csúszkákat:
- Hue - Színárnyalat
- Saturation - Telítettség
- Brightness - Világosság
- Vagy írd be közvetlenül (HEX, RGB, stb.)
Eszközök
Contrast Checker
Ellenőrizd a szöveg és háttér kontrasztját:
- Menj: coolors.co/contrast-checker
- Válaszd ki a szöveg és háttér színét
- Lásd a WCAG megfelelőséget:
- AA - Minimum követelmény
- AAA - Kiváló kontraszt
Palette Visualizer
Nézd meg színeidet valós design-okban:
- Hozz létre palettát
- Kattints a Visualize gombra
- Lásd a színeket:
- Weboldalon
- Mobil app-ban
- Poszteren
- Üzleti anyagokon
Color Blindness Simulator
Ellenőrizd, hogyan látják a színeket:
- Válaszd ki a palettát
- Kattints: View → Color blindness
- Lásd a különböző típusokat:
- Deuteranopia
- Protanopia
- Tritanopia
Image Picker
Színek kinyerése képekből:
- Menj: coolors.co/image-picker
- Tölts fel egy képet
- A Coolors automatikusan kinyeri a fő színeket
- Finomhangold és mentsd el
Integrációk
Figma Plugin
- Keresd meg a Coolors plugint Figmában
- Telepítsd
- Használd közvetlenül a designban
Adobe Extension
Elérhető:
- Photoshop
- Illustrator
- InDesign
Chrome Extension
- Telepítsd: Chrome Web Store
- Kattints az ikonra bármely weboldalon
- Generálj palettát vagy nyerd ki a színeket
iOS App
Letölthető az App Store-ból:
- Paletták generálása
- Kamera alapú szín azonosítás
- Offline használat
Pro verzió
Mit ad a Pro?
| Funkció | Free | Pro |
|---|---|---|
| Paletta generálás | ✓ | ✓ |
| Paletta mentés | 5 | Korlátlan |
| Projektek | 1 | Korlátlan |
| PDF export | Alap | Haladó (árnyalatok, színvakság) |
| Ads | Van | Nincs |
| Pro profile | - | ✓ |
| Palette Visualizer | - | ✓ |
Pro Profile
Személyes profil oldal a palettáid, projektjeid és collection-jeid bemutatására.
Tippek designereknek
1. 60-30-10 szabály
- 60% - Fő háttérszín
- 30% - Másodlagos szín
- 10% - Kiemelő szín (accent)
2. Színharmonikusok
| Típus | Leírás |
|---|---|
| Complementary | Szemközti színek |
| Analogous | Szomszédos színek |
| Triadic | Egyenlő távolságú hármas |
| Split-complementary | Kiegészítő szín két szomszédja |
3. Webes használat
:root {
--color-primary: #2A9D8F;
--color-secondary: #264653;
--color-accent: #E9C46A;
--color-background: #F4F1DE;
--color-text: #1D1D1D;
}
4. Mentsd el a kedvenceket
Hozz létre Collection-öket:
- Projekt alapú (Weboldal X, App Y)
- Stílus alapú (Minimál, Vibrant, Pasztell)
- Ügyfél alapú
Népszerű paletták
Böngészés
- Menj: coolors.co/palettes
- Szűrj:
- Trending - Népszerűek
- Latest - Legújabbak
- Color - Adott szín alapján
- Mentsd el vagy módosítsd
Példa paletták
Modern minimál:
#1A1A2E - #16213E - #0F3460 - #E94560 - #FFFFFF
Természetes:
#606C38 - #283618 - #FEFAE0 - #DDA15E - #BC6C25
Pasztell:
#FFE5EC - #FFC2D1 - #FFB3C6 - #FF8FAB - #FB6F92
WordPress fejlesztéshez
Theme colors
// theme.json (WordPress 5.8+)
{
"settings": {
"color": {
"palette": [
{
"slug": "primary",
"color": "#2A9D8F",
"name": "Primary"
},
{
"slug": "secondary",
"color": "#264653",
"name": "Secondary"
}
]
}
}
}
Customizer colors
// functions.php
$wp_customize->add_setting('primary_color', [
'default' => '#2A9D8F',
'sanitize_callback' => 'sanitize_hex_color',
]);
Alternatívák
| Eszköz | Előny |
|---|---|
| Adobe Color | Adobe integráció |
| Paletton | Részletes színelmélet |
| Color Hunt | Kuratált paletták |
| Colormind | AI alapú generálás |
| Khroma | AI tanul a preferenciáidból |