What are color harmonies?

Color harmonies are sets of colors related by a mathematical rule on the color wheel — complementary (180° apart), triadic (120° apart), tetradic, analogous, split-complementary, and so on. Designers use them to build palettes that feel intentional and balanced.

Which harmony should I pick?

Complementary and split-complementary work well for high-contrast accents (buttons, alerts). Analogous schemes are calm and natural-looking. Triadic and tetradic produce vibrant, varied palettes that need careful balancing. Monochromatic is great for content-heavy UIs.

Does this match the rotations in Adobe Color, Coolors, etc.?

Yes — the angles used here (30°, 90°, 120°, 150°, 180°, 270°) match the standard color theory definitions you'll find in design tools and textbooks.

מחולל הרמוניות צבעים

בסיס

סכימה

Base + opposite (180°)

#3B82F6base

rgb(59, 130, 246)

hsl(217, 91%, 60%)

#F6AF3Ccomplement (180°)

rgb(246, 175, 60)

hsl(37, 91%, 60%)

פרטים טכניים

איך מחולל הרמוניות הצבע עובד

מה הכלי עושה

מחולל הרמוניות הצבע מחשב מערכי צבעים קשורים מתמטית מתוך גוון בסיס יחיד: משלימים, אנלוגיים, טריאדיים, טטרדיים, ריבועיים, משלימים-מפוצלים, מונוכרומטיים וגוונים. כל פלטה מוצגת עם ערכי HEX, RGB ו-HSL שניתן להעתיק בלחיצה ולהשתמש בהם ישירות ב-CSS או בטוקני עיצוב.

מקרי שימוש נפוצים למפתחים

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

פורמטי נתונים, טיפוסים או וריאנטים

זמינות שמונה סכמות: משלימה (בסיס + 180°), אנלוגית (בסיס ± 30°), טריאדית (3 צבעים במרחק 120°), טטרדית (מלבנית, 4 צבעים), ריבועית (4 צבעים במרחק 90°), משלימה-מפוצלת (בסיס + ±150°), מונוכרומטית (אותו גוון ברמות בהירות משתנות 10–90%), וגוונים (אותו גוון, מכהה לבהיר). כל צבע כולל את הייצוגים שלו ב-HEX, RGB ו-HSL יחד עם תווית תפקיד.

מלכודות נפוצות ומקרי קצה

הרמוניות שמופקות מצבעי בסיס דלי-רוויה מאוד או כמעט בגווני אפור נראות בלתי מובחנות בין הסכמות — התחילו מצבע בסיס רווי. צבעי בסיס רוויים מאוד בשילוב סכמות טריאדיות או טטרדיות יכולים להפיק פלטות צורמות וקשות לאיזון; שקלו להפחית רוויה לשימוש בממשק. חלק מהצמדים שמופקים מהרמוניות אינם עומדים בניגודיות WCAG — תמיד בדקו זוגות טקסט/רקע בכלי Color Contrast לפני השקה.

מתי להשתמש בכלי הזה לעומת קוד

השתמשו בכלי הדפדפן לרעיונאות, חקירה מהירה וביקורת עיצוב. בקוד, ספריות כמו chroma.js, colord או culori מאפשרות לחשב הרמוניות באופן תכנותי, לשלב אותן בצינורות בנייה של טוקני עיצוב, ולשלב את המתמטיקה של ההרמוניה עם מרחבי צבע אחידים תפיסתית כמו Oklch לקבלת פלטות שנראות אחידות יותר.