Megtaláltad a tökéletes színt HEX formátumban, de a tervező eszköz RGB-t igényel. Vagy egy ügyfél RGB-ben küldött egy színt, és szükséged van az HSL értékre a CSS-hez. A színformátum-konverzió a tervezők és fejlesztők napi feladata. A Szín-konvertáló eszközünk azonnali megoldást kínál.
Amire szükséged van
- Egy szín értéke bármilyen formátumban (HEX, RGB, HSL vagy más)
- Webböngésző (Chrome, Firefox, Safari vagy Edge)
- Nincs szükség fiókra vagy telepítésre
Lépésről lépésre útmutató
Add meg a szín értékét
Nyisd meg a Szín-konvertáló eszközt. Géped be vagy illeszd be a szín értékét bármilyen támogatott formátumban. Például add meg a #3B82F6 értéket HEX formátumban, az rgb(59, 130, 246) értéket RGB-ben, vagy a hsl(217, 91%, 60%) értéket HSL-ben. Az eszköz automatikusan felismeri a formátumot.
Nézd meg az összes formátum konverzióját
Az eszköz azonnal megjeleníti a színedet az összes támogatott formátumban: HEX, RGB, HSL és egyebek. Láthatod a szín élő előnézetét az összes egyenértékű értékkel együtt. Ha módosítani szeretnéd a színt, a szín-kiválasztóval vizuálisan finomíthatod.
Másold a kívánt formátumot
Kattints a másolás gombra bármelyik formátum mellett, hogy kimásolja az értéket a vágólapra. Illeszd be közvetlenül a CSS fájlba, tervező eszközbe, vagy bárhova, ahova szükséges. Nincs szükség kézi újragépelésre.
Hasznos tudnivaló A Szín-konvertáló teljes egészében a böngésződben fut. Offline is működik betöltés után, és nincs szükség fiókra vagy telepítésre.
A színformátumok megértése
A különböző eszközök és kontextusok különböző színformátumokat használnak. Íme, mikor melyiket érdemes használni:
HEX
A weben legelterjedtebb formátum. A HEX szín # karakterrel kezdődik, amelyet hat karakter (betűk és számok) követ, például #FF5733.
- Használják: CSS, HTML, tervező eszközök (Figma, Sketch, Photoshop)
- Formátum:
#RRGGBBahol minden pár 00-tól FF-ig terjedő hexadecimális értéket jelöl - Példa:
#3B82F6(közepes kék)
RGB
Leírja a színt Piros, Zöld és Kék összetevőivel, amelyek mindegyike 0-tól 255-ig terjed.
- Használják: CSS (
rgb()függvény), programozási nyelvek, LED-világítás - Formátum:
rgb(piros, zöld, kék) - Példa:
rgb(59, 130, 246)
HSL
Leírja a színt Hue (árnyalat, 0-360 fok a színkörön), Saturation (telítettség, 0-100%) és Lightness (világosság, 0-100%) segítségével.
- Használják: CSS (
hsl()függvény), színelmélet, dizájnrendszerek - Formátum:
hsl(árnyalat, telítettség%, világosság%) - Példa:
hsl(217, 91%, 60%)
Tipp A HSL a legintuitivabb formátum a színek beállításához. Világosabb árnyalatot szeretnél? Növeld a világossági értéket. Tompítottabb tónust szeretnél? Csökkentsd a telítettséget. Ez a HSL-t ideálissá teszi szín-rendszerek felépítéséhez és az alapszín variánsainak létrehozásához.
Mikor melyik formátumot érdemes használni?
| Helyzet | Ajánlott formátum |
|---|---|
| CSS kézzel írása | HEX (rövid és ismerős) vagy HSL (könnyen módosítható) |
| Tervező eszköz specifikációk | HEX (iparági szabvány) |
| Dinamikus szín-manipuláció kódban | HSL (legkönnyebb programozottan beállítani) |
| Színek kommunikálása ügyfeleknek | HEX (legszélesebb körben ismert) |
| Nyomtatástervezés | CMYK (különálló a képernyős formátumoktól) |
Túl az egyedi színeken
Miután a szín konvertálva van, esetleg fel szeretnéd fedezni a kapcsolódó eszközöket:
- Gradiens-generátor: Hozz létre sima CSS gradienst a színeid alapján. Add meg kettő vagy több színt, és kapd meg a gradient kódot, készen a stíluslapba való beillesztésre.
- Színpaletta-generátor: Generálj harmonikus színpalettákat az alapszíned alapján. Kapj automatikusan komplementer, analóg, triád és más színsémákat.
Ezek az eszközök kéz a kézben működnek a Szín-konvertálóval, hogy segítsenek teljes szín-rendszert felépíteni a projektedhez.
Fontos A színek különbözőképpen nézhetnek ki különböző képernyőkön a kijelző kalibrálása, a színprofilok és a fényerő-beállítások miatt. Ha a szín pontossága kritikus (arculat, nyomtatástervezés), mindig ellenőrizd a színeket a célmédiumon, ne csak a képernyőn.
Gyakran ismételt kérdések
Mi a különbség a HEX és az RGB között?
Ugyanazt az információt képviselik különböző jelölésrendszerben. A HEX hexadecimálist (16-os alapú), az RGB decimálist (10-es alapú) használ. A #FF0000 és az rgb(255, 0, 0) egyaránt tiszta piros.
Konvertálhatok CMYK-vá nyomtatáshoz? A képernyős színformátumok (HEX, RGB, HSL) és a nyomtatási formátumok (CMYK) alapvetően különböző színmodellek. Matematikai konverzió létezik, de a pontos nyomtatási színekhez professzionális színkezelő eszközt érdemes használni.
Mi a helyzet az átlátszósággal (alfa)?
A HEX két extra karakterrel támogatja az alfát (#3B82F680). Az RGB és HSL az rgba() és hsla() függvényekkel. A Szín-konvertáló ezeket a formátumokat is kezeli.
Következő lépések
A szín konvertálása után próbáld ki a Gradiens-generátort gyönyörű CSS gradensek létrehozásához, vagy használd a Színpaletta-generátort teljes színséma felépítéséhez a kiválasztott szín köré.