Color Palette סורק כל אלמנט בדף אינטרנט וחולץ את מערכת הצבעים המלאה בשימוש — מטקסט ורקעים ועד גבולות, צלליות ומבטאים. הצבעים מוצגים כ-color swatches ויזואליות ממוינות לפי תדירות (הנפוצים ביותר ראשונים), כל אחד מציג את ערך ה-HEX שלו ומספר השימושים. לחץ על כל swatch להעתקה, או ייצא את ה-palette כולו כרשימת קודי צבעים.
לכל אתר מעוצב היטב יש color palette עקבית — בדרך כלל 3-8 צבעים ראשיים בתוספת כמה ניטרליים. Color Palette חולץ את ה-palette הזה אוטומטית על ידי סריקת ערכי color, background-color, border-color ו-box-shadow המחושבים של כל אלמנט. התוצאה היא אוסף ממוין לפי תדירות של כל צבע בדף, המעניק לך את התמונה המלאה של מערכת הצבעים של האתר. צבעים דומיננטיים (צבע המותג הראשי, צבע הרקע, צבע הטקסט) מופיעים ראשונים עם מספרי שימוש גבוהים. צבעי מבטא וערכים חד-פעמיים מופיעים למטה. זה יקר ערך למחקר עיצוב — בקר בכל אתר וחלץ את ה-color palette המדויק שלו תוך שניות. שימושי גם לביקורת האתר שלך עצמך: האם ישנם צבעים סוטים שאינם שייכים למערכת העיצוב שלך? האם אתה משתמש ב-5 גוונים שונים במקצת של אפור כשמפרט העיצוב מגדיר רק 3? Color Palette הופך את כל השימוש בצבעים לגלוי ומנין.
סורק כל אלמנט גלוי בדף וחולץ צבעים ממאפיינים מחושבים: color, background-color, border-color, box-shadow color, outline-color, ו-text-decoration-color. כל צבע בשימוש בדף נלכד.
צבעים ממוינים לפי מספר שימושים — הצבע הנפוץ ביותר מופיע ראשון. צבעי מותג דומיננטיים ורקעים עולים לראש, בעוד שצבעי מבטא חד-פעמיים מופיעים אחרונים. ראה באופן מיידי את הצבעים הראשיים, המשניים וצבעי המבטא של הדף.
כל צבע מוצג כ-swatch ויזואלי גדול עם קוד ה-HEX ומספר השימושים המוצגים מתחת. ה-swatches גדולות מספיק להבחנת הבדלי גוון עדינים (כגון #333 לעומת #2a2a2a).
לחץ על כל color swatch להעתקת ערך ה-HEX שלה ללוח ההעתקה שלך באופן מיידי. אין צורך לפתוח פאנל צבע או דיאלוג משני — לחיצה אחת, הועתק, סיום.
לחץ על "ייצא הכול" להעתקת ה-palette המלא כרשימה מפורמטת של קודי צבע HEX. הדבק בכלי עיצוב, קובץ CSS variables, או תיעוד צבעים. הרשימה שומרת על סדר המיון לפי תדירות.
צבעים עוברים נורמליזציה (ייצוגי rgb ו-hex של אותו צבע ממוזגים) וביטול כפילויות. ה-palette מציג צבעים ייחודיים בלבד, עם מספרי שימוש משולבים עבור ייצוגים כפולים.
בקר באתרים עם סכמות צבעים יפות וחלץ את ה-palette המדויק שלהם. השתמש בצבעים כנקודת פתיחה לעיצוב שלך עצמך — או פשוט תעד אילו שילובי צבעים עובדים היטב יחד.
הפעל את Color Palette באתר שלך עצמך לאימות עקביות צבעי המותג. האם ישנם 4 גוונים כחולים שונים במקצת כשאמור להיות 1? האם צבעים חורגים מהמותג מתגנבים פנימה? המיון לפי תדירות הופך אי-עקביות לברורות.
ייצא את ה-palette והמר אותו ל-CSS custom properties (--color-primary, --color-secondary, וכו'). הפלט הממוין לפי תדירות מספר לך אילו צבעים ראויים לתפקידים ראשיים, משניים ומבטאים.
חלץ color palettes מאתרי מתחרים כדי להבין את מיצוב המותג שלהם. צבעים חמים לעומת קרירים, ניגוד גבוה לעומת עמום — ה-palette חושף בחירות עיצוב מכוונות.
ראה את כל צבעי הטקסט לצד צבעי הרקע. האם ישנם שילובים של טקסט-רקע עם ניגוד נמוך מדי? ה-palette מספק לך את מערכת הצבעים המלאה לבדיקה מול דרישות ניגוד WCAG.
פתח את הדוק הצף של DevSuite Pro ולחץ על סמל Color Palette. הכלי סורק כל אלמנט בדף וחולץ את כל ערכי הצבע.
רשת של color swatches מופיעה, ממוינת לפי תדירות שימוש. הצבעים הנפוצים ביותר נמצאים בראש. כל swatch מציגה את קוד ה-HEX ומספר האלמנטים המשתמשים באותו צבע.
לחץ על כל swatch להעתקת ערך ה-HEX שלה ללוח ההעתקה שלך. אישור קצר מופיע.
לחץ על "ייצא הכול" להעתקת כל צבע כרשימה מפורמטת. הדבק בקובץ CSS variables שלך, בכלי עיצוב, או בתיעוד.
נווט לדפים שונים באותו אתר וחלץ palettes לאימות עקביות הצבעים ברחבי האתר.
התקן את DevSuite Pro בחינם ופתח 39+ כלי פיתוח לדפדפן שלך.
