Ugrás a fő tartalomhoz

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ó

  1. Látogass el: coolors.co/generate
  2. Nyomj Space-t új palettához
  3. Kattints a lakat ikonra tetszett színnél
  4. Ismételd amíg elégedett nem leszel

Billentyűkombinációk

BillentyűFunkció
SpaceÚj paletta generálása
LSzín zárolása/feloldása
CSzín másolása
SPaletta mentése
EPaletta exportálása
AAlternatív árnyalatok

Szín módosítása

  1. Kattints egy színre
  2. Használd a csúszkákat:
    • Hue - Színárnyalat
    • Saturation - Telítettség
    • Brightness - Világosság
  3. 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:

  1. Menj: coolors.co/contrast-checker
  2. Válaszd ki a szöveg és háttér színét
  3. 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:

  1. Hozz létre palettát
  2. Kattints a Visualize gombra
  3. Lásd a színeket:
    • Weboldalon
    • Mobil app-ban
    • Poszteren
    • Üzleti anyagokon

Color Blindness Simulator

Ellenőrizd, hogyan látják a színeket:

  1. Válaszd ki a palettát
  2. Kattints: ViewColor blindness
  3. Lásd a különböző típusokat:
    • Deuteranopia
    • Protanopia
    • Tritanopia

Image Picker

Színek kinyerése képekből:

  1. Menj: coolors.co/image-picker
  2. Tölts fel egy képet
  3. A Coolors automatikusan kinyeri a fő színeket
  4. Finomhangold és mentsd el

Integrációk

Figma Plugin

  1. Keresd meg a Coolors plugint Figmában
  2. Telepítsd
  3. Használd közvetlenül a designban

Adobe Extension

Elérhető:

  • Photoshop
  • Illustrator
  • InDesign

Chrome Extension

  1. Telepítsd: Chrome Web Store
  2. Kattints az ikonra bármely weboldalon
  3. 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óFreePro
Paletta generálás
Paletta mentés5Korlátlan
Projektek1Korlátlan
PDF exportAlapHaladó (árnyalatok, színvakság)
AdsVanNincs
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ípusLeírás
ComplementarySzemközti színek
AnalogousSzomszédos színek
TriadicEgyenlő távolságú hármas
Split-complementaryKiegé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

  1. Menj: coolors.co/palettes
  2. Szűrj:
    • Trending - Népszerűek
    • Latest - Legújabbak
    • Color - Adott szín alapján
  3. 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özElőny
Adobe ColorAdobe integráció
PalettonRészletes színelmélet
Color HuntKuratált paletták
ColormindAI alapú generálás
KhromaAI tanul a preferenciáidból

Kapcsolódó linkek