פלטות צבעים

לכאורה לא פוסט של מתכנתים, כי מה למתכנתים ולעיצוב? בפועל, דווקא בגלל שמתכנתים לא תמיד יודעים לשלב צבעים (כן, סטריאוטיפ וסטיגמה. בעצם אני מדברת על עצמי בגוף שלישי רבים…), ולא תמיד רוצים להטריד מעצב.ת (למשל, אם מדובר במשהו קטן לשימוש עצמי) רוצים לפעמים איזה כלי שימליץ על שילובי צבעים.

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

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

אתרי שילובי צבעים:

• אתר מהמם שבוחרים בו צבע, והוא מראה מה הם הצבעים המשלימים, הדומים, והשלמות של 3 או 4 צבעים (יש כפתור לכל אחת מהאפשרויות).
• בכלי היפה הזה בוחרים שני צבעים, ומקבלים פלטה של שני הצבעים האלה וגוונים שלהם, פלוס מתאימים גוונים של אפור.
• בכלי הזה בוחרים צבע ראשי וצבע משני ומקבלים שילוב, כולל באיזה צבע טקסט להשתמש. יש גם טאב של נגישות שמציין קריאות של כל צבע בתור רקע.
• Color Hunt – פשוט מראה קבוצות של שילובי צבעים
• Design Seeds – שילובי צבעים מבוססים על תמונות יפות
• Paletton – מנגנון שבו בוחרים צבע, והאתר נותן גוווני צבעים נוספים שהולכים עם הצבע הנבחר. הוא מגדיל לעשות ומראה איך לשלב את הצבעים באתר – איזה מהגוונים מתאים ככותרת, איזה כצבע רקע, וכד’.
• שילובי צבעים עם חיפוש
• פלטות מבוססות על 50 אתרים מרשימים ויזואלית (התווסף ב-18/8/17. תודה לדנה פרידמן תאבדי)
• אתר שבלחיצת כפתור יוצר פלטת צבעים. כל לחיצה יוצרת פלטה חדשה.
• פלטות צבעים מבוססות מידע (data driven).
• עוד אתר של פלטות מבוססות תמונת
• יש לכם מערך של צבעים בקוד הקסה ואתם מתקשים לדמיין איך נראית הפלטה? dotcolors נותן מענה: הכניס את צבעי המערך באתר, והוא יראה לכם את הצבעים
• אתר בשם פיגמנט. מראה משפחות של צבעים, ומאפשר באמצעות מחוונים בצד, להבהיר או להכהות את הגוונים, ולחזק או לעמעם אותם.
• אתר שמכיל פלטות צבעים מוכנות, וגם מאפשר ליצור פלטות מתוך תמונות שמעלים לאתר.
• אתר שיוצר סקאלת צבעים, לפי בחירת RGB של המשתמש.
• אתר שאוסף שילובי צבעים שנבחרו ידנית.
• פן ב-codepen שמייצר הרמוניות צבעים “רנדומליות”.
• אתר שמייצר פלטות צבעים בלחיצה על מקש הרווח. אפשר לבחור איזה סוג צבעים רוצים: צבעים כהים, בהירים או חזקים (bright); ואם רוצים גוון כלשהו – ירוק, סגול, מונוכרומטי וכד’. (התווסף ב-29/1/19)
• אתר שמייצר פלטות בצעים בכל רענון של עמוד (התווסף ב-4/7/19)
• אתר שמציע פלטות צבעים לפי קטגוריות: צבעים דומים, צבעים מונוכרומטיים, שילובים של 3 צבעים ושילובים של 4 צבעים. בתוך הקטגוריות האלה יש חלוקה לכהה/בהיר, או לפי צבעים.
• אתר ששולף פלטת צבעים מתמונות. כרגע זה מתמונות שקיימות באתר. (התווסף ב-22/9/19)
• אתר שנותן כל מיני גוונים לפי צבע נבחר. הרבה אופציות לבחור ולדייק. (התווסף ב-22/9/19)
• אתר שנותן מגוון צבעים בין צבע התחלה לצבע סיום שמוגדרים לו. על המוטיבציה לבנות (עוד) אתר שמייצר פלטת צבעים אפשר לקרוא כאן. (התווסף ב-25/9/19)
• אתר פלטות צבעים – כל פלטה מכילה חמישה צבעים. ויש באתר הזה עוד דבר נחמד: משחק גרדיאנט (פירוט בתת הכותרת של המשחקים)
• אתר שיוצר פלטת צבעים מתוך תמונה שמעלים (התווסף ב-9/12/19)
• אתר שמאפשר לבחור צבע מתוך פלטת צבעים, והוא מציע שילובי צבעים עם הצבע הזה. יש גם שילובי צבעים שמוצעים בברירת המחדל. כשבוחרים שילוב צבע, האתר מראה איך לשלב את הצבעים באתר אמיתי.
• אתר גוונים שמחים (התווסף ב-5/4/2020)
• יצרן פלטות צבעים (התווסף ב-3/5/2020)
• רשימה של 50 אתרים ששילובי הצבעים בהם יפים (4/5/2020)
• אתר ששולף את כל הצבעים שיש בתמונה שמעלים אליו, עם קודי ה-RGC שלהם. לא בהכרח יוצר פלטה, אבל כן נותן את כל הנתונים להכין אחת כזאת מתמונה ספציפית. (19/5/2020)
• ועוד אתר שנותן את צבעי ה-RGB של תמונה שמעלים אליו. במקרה של האתר הזה צריך ללחוץ על החלק בתמונה שאת צבעו רוצים לקבל (4/6/2020)
• שמות צבעים משעשעים (31/5/2020).
• אתר שעושה שני דברים: יוצר גוונים מצבעים נתונים, ומראה את הנגישות של הצבעים.
• אתר שנותן לבחור צבע ואז מציע פלטת צבעים שלמה, ובנוסף מאפשר להחיל על כל הפלטה צבעים נוספים לבחירה
• יצרן פלטות צבעים רנדומלי
• פוסט ב-daily-dev-tips שמביא חמישה אתרי השראה לצבעים
• אתר שמייצר פלטות צבעים לפי כמות צבעים נבחרת
• צבעי אדמה מותך תמונות

נגישות צבעים

• כלים ומשאבים להנגשת צבעים (התווסף ב-05/2019)
• אתר שמראה איך שילובי צבעים (שניים או יותר) נראים מבחינת נגישות. הוא מראה מה קורה כשכל אחד מהשילובים הוא רקע והשני הוא צבע הטקסט, ואיך כל אחד מהצבעים נראה כרקע לשחור וללבן. (התווסף ב-25/2019)
• אתר שמייצר שילובי צבעים נגישים (התווסף ב-2/10/19)
• אתר שבודק נגישות שילובי צבעים (התווסף ב-31/5/2020)
• אתר שמייצר פלטות צבעים, ומאפשר בלחיצת עכבר להעתיק את צבעיההפלטה או צבעים ספציפיים (התווסף ב-1/10/202)
• פוסט ב-WPShout על אתר פשוט שבודק נגישות של ניגודיות

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

• עשרה כלים מומלצים
• 28 הכלים הכי טובים
• שיטות שונות לשילוב צבעים
• מכיוון אחר אבל מעניין : בחירת צבע לבית.

מאמרים על התאמת צבעים

• פסיכולוגיה מאחורי צבעים
• מאמר בסמשינג על בחירת ערכת צבעים – איך לבחור צבע בסיס, ולהתאים לוצבעים נלווים. יש אפילו קטע על איך להתאים גוונים שונים של אפור (התווסף ב-3/5/2015)
• 5 בחירות צבעוניות שיש להמנע מהן באינטרנט (התווסף ב-3/5/2015)
• 6 טכניקות להתאמת צבעים (התווסף ב-3/5/2015)
• Calcolor – אתר שמוקדש לצבעים ובמיוחד לחישובים שקשורים אליהם. הוא מסביר איך כל צבע בנוי מבחינת RGB ו-HSL, מאפשר ליצור פלטות צבעים אישיות, מראה גווני צבעים, ועוד דברים משוכללים ויפים.(התווסף ב-17/4/2020)
• אתר שממיין צבעים לפי גוונים (התווסף ב-9/6/2020)
• איך לבחור צבעים לוויזואליזציית מידע (התווסף ב-247/9/2020)

משחקים של זיהוי צבע

• לזהות מהו הצבע (מתוך שלוש אפשרויות) עפ”י ערכי ה-RGB
• והפוך: לזהות מהו ה-RGB של צבע נתון
• לסדר קוביות של גוונים לפי סדר, ואותו דבר בלינק אחר
• לזהות את הקוביה עם הגוון השונה
• מבחן עיוורון צבעים
• משחק גרדיאנט. נתונה תמונת גרידאנט, ויש לנו סליידרים של הצבעים ירוק, כחול ואדום לצבע התחלה ולצבע סיום. צריך להזיז את הסליידרים כך שייצרו את הגרדיאנט הנתון. זה כיף! (התווסף ב-25/9/19)

גרדיאנטים יפים

אתר עם אוסף גרדיאנטים יפים. יש חלוקה לקטגוריות