בורר צבעים אונליין: גלגל צבעים וממיר (HEX, RGB, LCH)

הגדרות קבועות מראש

בין אם אתם מעצבי אתרים המכווננים סגנונות CSS, גרפיקאים המחפשים את הגוון המושלם ללוגו, או סתם זקוקים לברר במהירות את קוד הצבע האהוב עליכם, כלי בחירת הצבעים המתקדם (Color Picker) שלנו כאן בשבילכם.

תשכחו מהפעלת פוטושופ מסורבל או חיפוש תוספים לדפדפן. כאן עומדת לרשותכם מעבדת צבעים שלמה, שפועלת מיידית, תומכת בכל הפורמטים וזוכרת את עבודתכם.

למה להשתמש בכלי בחירת צבעים זה?

הווידג’ט שלנו הוא לא סתם גלגל צבעים רגיל. הוא תוכנן לפרודוקטיביות ודיוק מרביים.

1. כל הפורמטים תחת קורת גג אחת 🎨

צריכים להמיר HEX ל-RGB? או שאתם עובדים עם HSL מודרני? הכלי שלנו ממיר באופן אוטומטי ובזמן אמת את הערכים בין כל התקנים הנפוצים.

  • HEX: עבור HTML ו-CSS (לדוגמה: #ff5733).
  • RGB: עבור מסכים דיגיטליים ותוכנות גרפיקה.
  • HSL & HSV: עבור עריכות אינטואיטיביות של רוויה ובהירות, שתעריכו בעת יצירת פלטות צבעים.

2. היסטוריה חכמה והגדרות קבועות מראש 🕒

אין דבר מתסכל יותר מאשר למצוא את הצבע המושלם ולאבד אותו בטעות.

  • היסטוריה אוטומטית: הכלי זוכר את הצבעים האחרונים שעבדתם איתם (גם אם תרעננו את הדף).
  • הגדרות קבועות מראש מהירות: הכנו עבורכם סט של צבעי יסוד להתחלה מהירה.

3. שליטת גרירה ושחרור אינטואיטיבית 🖱️

השליטה חלקה ומדויקת. בעזרת העכבר או מגע בנייד תוכלו:

  • לשנות את הגוון בגלגל הצבעים הגדול.
  • לכוונן בעדינות את הרוויה והבהירות בריבוע המפורט.
  • או פשוט להקליד ערך מדויק ולתת לכלי לחשב את השאר.

מדריך למודלי צבע: מתי להשתמש בכל אחד?

עולם הצבעים הדיגיטלי יכול להיות מבלבל. הנה סקירה מהירה כדי שתדעו באיזה פורמט לבחור עבור הפרויקט שלכם.

פורמטשם מלאמתי להשתמש?
HEXהקסדצימליסטנדרט לאינטרנט. קוד בן שישה תווים (לדוגמה #000000), המשמש דפדפנים. הוא הקצר והקל ביותר להעתקה.
RGBאדום, ירוק, כחולמסכים ותצוגות. קובע כמה אור אדום, ירוק וכחול יש להאיר. הערכים הם 0–255.
HSLגוון, רוויה, בהירותתפיסה אנושית. הטוב ביותר למעצבים. רוצים צבע “קצת בהיר יותר” או “פחות רווי”? ב-HSL רק תשנו את האחוזים, ב-HEX הייתם צריכים לנחש.
HSVגוון, רוויה, ערךתוכנות גרפיקה. דומה ל-HSL, אך נפוץ בשימוש בכלים כמו פוטושופ או GIMP לבחירת צבעים.
LCHבהירות, כרומה, גווןדיוק מודרני. הוא “אחיד תפיסתית”. פותר את בעיית ה-HSL, שבה צהוב נראה בהיר יותר מכחול באותו ערך. ב-LCH, שינוי המספרים תואם בדיוק לאופן שבו העין האנושית תופסת את השינוי. אידיאלי למערכות עיצוב ונגישות.

כיצד לעבוד ביעילות עם בורר הצבעים

  1. בחירה גסה: לחצו על טבעת הצבעים לבחירת גוון בסיסי (Hue).
  2. כוונון עדין: בריבוע המרכזי, כווננו את הרוויה (תנועה ימינה/שמאלה) והבהירות (תנועה למעלה/למטה).
  3. הזנה ידנית: יש לכם קוד ספציפי, לדוגמה #3498db? הכניסו אותו לשדה HEX. הכלי יציג מיד תצוגה מקדימה ויחשב מחדש את ערכי RGB ו-HSL.
  4. העתקה: בלחיצה אחת על אייקון ההעתקה, שמרו את הקוד הסופי ללוח.
  5. חזרה בזמן: זקוקים לצבע שהיה לכם לפני רגע? עיינו בקטע היסטוריית צבעים בתחתית.

שאלות נפוצות (FAQ)

האם הכלי הזה עובד במצב לא מקוון (אופליין)? כן! כל חישוב הצבעים מתבצע ישירות בדפדפן שלכם באמצעות JavaScript. הנתונים שלכם אינם נשלחים לשרת כלשהו, מה שמבטיח מהירות ופרטיות מקסימליים. לאחר שהדף נטען, תוכלו לנתק את האינטרנט והווידג'ט ימשיך לפעול.
כיצד אני מעתיק צבע ל-CSS שלי? פשוט לחצו על כפתור ההעתקה שליד הערך HEX, RGB או HSL. הקוד יישמר ללוח שלכם (clipboard) ותוכלו להדביק אותו ישירות לעורך הקוד שלכם באמצעות Ctrl+V (או Cmd+V במק).
מה זה אומר כשאני מזין #fff וזה משתנה ל-#ffffff? זה בסדר. #fff הוא "קיצור דרך" (shorthand) עבור צבע לבן. הכלי שלנו ממיר אוטומטית קיצורים אלה לפורמט המלא בן שש הספרות, כדי להבטיח תאימות מרבית עם תוכנות אחרות.
מדוע צבעים בהדפסה נראים שונה ממה שאני רואה כאן? כלי זה עובד במרחב הצבעים RGB, המיועד למסכים מוארים (צגים, ניידים). מדפסות משתמשות במצב CMYK (דיו). חלק מהצבעים הבוהקים על המסך (במיוחד ירוקים וכחולים ניאון) לא ניתנים להדפסה פיזית, ולכן עלולים להיראות כהים יותר או פחות רוויים על הנייר.
האם זה עובד בנייד? בהחלט. הווידג'ט רספונסיבי לחלוטין ותומך בשליטה באמצעות מגע (touch events). תוכלו לערבב צבעים באצבעותיכם בנוחות כמו עם עכבר במחשב.