דילוג לתוכן הראשי
כלים אונליין 100% בדפדפן שלך — דף הבית

דגימת צבע מתמונה

ראיתם צבע ואתם צריכים את הקוד שלו? העלו את התמונה, לחצו על הנקודה, וקבלו HEX, ‏RGB ו־HSL — יחד עם בדיקה אם אפשר לכתוב בצבע הזה טקסט קריא.

גררו קובץ לכאן

או

PNG / JPG / WebP / GIF · עד 30MB

הקובץ מעובד במחשב שלך בלבד ולא נשלח לשום שרת

איך זה עובד?

  1. 1

    בחרו תמונה

    גררו לכאן תמונה מהמחשב או מהטלפון — PNG, JPG, WebP או GIF. התמונה נפתחת בדפדפן ולא נשלחת לשום מקום.

  2. 2

    לחצו על הצבע שאתם רוצים

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

  3. 3

    העתיקו את הקוד

    הכלי מציג מיד HEX, ‏RGB ו־HSL, ולידם כפתור העתקה. הצבעים שדגמתם נשמרים ברשימה כדי להשוות ביניהם.

  4. 4

    בדקו שהצבע קריא

    לכל צבע מוצג יחס הניגודיות מול רקע לבן ומול רקע שחור, עם הדירוג AA או AAA לפי תקן WCAG.

שאלות נפוצות

האם התמונה שלי מועלית לשרת?

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

איך מוצאים קוד HEX של צבע מתמונה?

מעלים את התמונה לכלי, לוחצים על הנקודה שמעניינת אתכם, והקוד מופיע מיד בפורמט ‎#RRGGBB. לחיצה על "העתקה" מכניסה אותו ללוח, ואפשר להדביק אותו ישירות ב־CSS, בפיגמה, בקנבה או בוורד.

מה ההבדל בין HEX, ‏RGB ו־HSL?

שלושתם מתארים בדיוק את אותו צבע בכתיב אחר. ‏HEX הוא הכתיב הנפוץ בעיצוב ובאתרים, ‏RGB מפרט את עוצמת האדום הירוק והכחול בנפרד ונוח לתוכנות עריכה, ו־HSL מתאר גוון, רוויה ובהירות — הכי נוח כשרוצים לייצר גרסה בהירה או כהה יותר של אותו צבע.

למה חשוב יחס הניגודיות?

תקן הנגישות WCAG דורש יחס של 4.5:1 לפחות בין צבע הטקסט לרקע כדי שהטקסט ייחשב קריא, ו־3:1 לכותרות גדולות. הכלי מחשב את היחס של הצבע שדגמתם מול לבן ומול שחור ואומר לכם אם הוא עובר AA או AAA — כך אפשר לדעת מראש אם אפשר לכתוב בצבע הזה.

אפשר לדגום צבע מצילום מסך?

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

אפשר להשתמש בכלי בלי עכבר?

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

הצבע שקיבלתי נראה מעט שונה מהמקור

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