DevToys Web Pro iconDevToys Web Proಬ್ಲಾಗ್
ನಮಗೆ ರೇಟಿಂಗ್ ನೀಡಿ:
ಬ್ರೌಸರ್ ಎಕ್ಸ್ಟೆನ್ಶನ್ ಪ್ರಯತ್ನಿಸಿ:

ಬಣ್ಣ ಸಮ್ಮಿಲನಗಳ ಜನರೇಟರ್

  • ಮೂಲ
    ಯೋಜನೆ
    Base + opposite (180°)
    #3B82F6base
    rgb(59, 130, 246)
    hsl(217, 91%, 60%)
    #F6AF3Ccomplement (180°)
    rgb(246, 175, 60)
    hsl(37, 91%, 60%)
    ತಾಂತ್ರಿಕ ವಿವರಗಳು

    ಕಲರ್ ಹಾರ್ಮನೀಸ್ ಜನರೇಟರ್ ಹೇಗೆ ಕೆಲಸ ಮಾಡುತ್ತದೆ

    ಈ ಸಾಧನ ಏನು ಮಾಡುತ್ತದೆ

    ಕಲರ್ ಹಾರ್ಮನೀಸ್ ಜನರೇಟರ್ ಒಂದೇ ಬೇಸ್ ಹ್ಯೂನಿಂದ ಗಣಿತೀಯವಾಗಿ ಸಂಬಂಧಿತ ಬಣ್ಣ ಸೆಟ್‌ಗಳನ್ನು ಲೆಕ್ಕಹಾಕುತ್ತದೆ: complementary, analogous, triadic, tetradic, square, split-complementary, monochromatic, ಮತ್ತು shades. ಪ್ರತಿ ಪ್ಯಾಲೆಟ್ ಅನ್ನು HEX, RGB, ಮತ್ತು HSL ಮೌಲ್ಯಗಳೊಂದಿಗೆ ರೆಂಡರ್ ಮಾಡಲಾಗುತ್ತದೆ; ನೀವು ಅವನ್ನು ಒಂದು ಕ್ಲಿಕ್‌ನೊಂದಿಗೆ ಕಾಪಿ ಮಾಡಿ CSS ಅಥವಾ ಡಿಸೈನ್ ಟೋಕನ್‌ಗಳಲ್ಲಿ ನೇರವಾಗಿ ಬಳಸಬಹುದು.

    ಡೆವಲಪರ್‌ಗಳ ಸಾಮಾನ್ಯ ಬಳಕೆ ಪ್ರಕರಣಗಳು

    ಡಿಸೈನರ್‌ಗಳು ವಿಭಿನ್ನ ಹಾರ್ಮನಿ ನಿಯಮಗಳ ಅಡಿಯಲ್ಲಿ ಬ್ರ್ಯಾಂಡ್ ಹ್ಯೂ ಹೇಗೆ ರೂಪಾಂತರಗೊಳ್ಳುತ್ತದೆ ಎಂಬುದನ್ನು ಅನ್ವೇಷಿಸಿ ಬ್ರ್ಯಾಂಡ್ ಪ್ಯಾಲೆಟ್‌ಗಳ ಪ್ರೋಟೋಟೈಪ್ ಮಾಡುತ್ತಾರೆ. ಫ್ರಂಟ್‌ಎಂಡ್ ಡೆವಲಪರ್‌ಗಳು ಪ್ರಾಥಮಿಕ ಬ್ರ್ಯಾಂಡ್ ಬಣ್ಣದಿಂದ ಬಟನ್‌ಗಳು, ಅಲರ್ಟ್‌ಗಳು, ಮತ್ತು ಬ್ಯಾಡ್ಜ್‌ಗಳಿಗಾಗಿ ಆಕ್ಸೆಂಟ್ ಬಣ್ಣಗಳನ್ನು ಸೀಡ್ ಮಾಡುತ್ತಾರೆ. ಡೇಟಾ ವಿಸುಯಲೈಜೇಶನ್ ಎಂಜಿನಿಯರ್‌ಗಳು ಉದ್ದೇಶಪೂರ್ವಕವಾಗಿ ಕಾಣುವ ಆದರೆ ಇನ್ನೂ ವಿಭೇದಿಸಬಹುದಾದ ವರ್ಗಾತ್ಮಕ ಬಣ್ಣ ಸೆಟ್‌ಗಳನ್ನು ಆಯ್ಕೆಮಾಡುತ್ತಾರೆ. ಪ್ರಾಡಕ್ಟ್ ಮ್ಯಾನೇಜರ್‌ಗಳು ವಿಶೇಷ ಡಿಸೈನ್ ಟೂಲಿಂಗ್ ಅಗತ್ಯವಿಲ್ಲದೆ ಡಿಸೈನ್ ಪ್ರಸ್ತಾವನೆಗಳನ್ನು ವಿಮರ್ಶಿಸುವಾಗ ಪ್ಯಾಲೆಟ್ ಆಯ್ಕೆಗಳನ್ನು ಹೋಲಿಸುತ್ತಾರೆ.

    ಡೇಟಾ ಸ್ವರೂಪಗಳು, ಪ್ರಕಾರಗಳು, ಅಥವಾ ರೂಪಾಂತರಗಳು

    ಎಂಟು ಸ್ಕೀಮ್‌ಗಳು ಲಭ್ಯವಿವೆ: Complementary (base + 180°), Analogous (base ± 30°), Triadic (3 colors 120° apart), Tetradic (rectangular 4-color), Square (4 colors 90° apart), Split-complementary (base + ±150°), Monochromatic (same hue at varying lightness 10–90%), ಮತ್ತು Shades (same hue, dark to light). ಪ್ರತಿ ಬಣ್ಣವು ಅದರ HEX, RGB, ಮತ್ತು HSL ಪ್ರತಿನಿಧಿಕೆಗಳ ಜೊತೆಗೆ ಒಂದು role label ಅನ್ನು ಒಳಗೊಂಡಿರುತ್ತದೆ.

    ಸಾಮಾನ್ಯ ತಪ್ಪುಗಳು ಮತ್ತು ಎಡ್ಜ್ ಕೇಸ್‌ಗಳು

    ಅತಿಯಾಗಿ ಡಿಸ್ಯಾಚುರೇಟ್ ಆಗಿರುವ ಅಥವಾ ಗ್ರೇಸ್ಕೇಲ್‌ಗೆ ಹತ್ತಿರದ ಬೇಸ್ ಬಣ್ಣಗಳಿಂದ ಬಂದ ಹಾರ್ಮನಿಗಳು ಸ್ಕೀಮ್‌ಗಳಾದ್ಯಂತ ಭೇದಿಸಲಾಗದಂತೆ ಕಾಣುತ್ತವೆ — ಸ್ಯಾಚುರೇಟ್ ಆದ ಬೇಸ್‌ನಿಂದ ಪ್ರಾರಂಭಿಸಿ. triadic ಅಥವಾ tetradic ಸ್ಕೀಮ್‌ಗಳೊಂದಿಗೆ ಸೇರಿಸಿದ ಅತ್ಯಂತ ಸ್ಯಾಚುರೇಟ್ ಬೇಸ್‌ಗಳು ಜೋರಾಗಿ, ಸಮತೋಲನಗೊಳಿಸಲು ಕಷ್ಟವಾದ ಪ್ಯಾಲೆಟ್‌ಗಳನ್ನು ಉತ್ಪಾದಿಸಬಹುದು; UI ಬಳಕೆಗೆ ಸ್ಯಾಚುರೇಶನ್ ಅನ್ನು ಸ್ವಲ್ಪ ಕಡಿಮೆ ಮಾಡುವುದನ್ನು ಪರಿಗಣಿಸಿ. ಹಾರ್ಮನಿಗಳಿಂದ ಬಂದ ಕೆಲವು ಜೋಡಣೆಗಳು WCAG ಕಾಂಟ್ರಾಸ್ಟ್‌ನಲ್ಲಿ ವಿಫಲವಾಗುತ್ತವೆ — ಶಿಪ್ ಮಾಡುವ ಮೊದಲು Color Contrast ಟೂಲ್‌ನಲ್ಲಿ ಪಠ್ಯ/ಹಿನ್ನೆಲೆ ಜೋಡಿಗಳನ್ನು ಯಾವಾಗಲೂ ಪರಿಶೀಲಿಸಿ.

    ಕೋಡ್‌ಗಿಂತ ಈ ಸಾಧನವನ್ನು ಯಾವಾಗ ಬಳಸಬೇಕು

    ಐಡಿಯೇಷನ್, ತ್ವರಿತ ಅನ್ವೇಷಣೆ, ಮತ್ತು ಡಿಸೈನ್ ರಿವ್ಯೂಗಾಗಿ ಬ್ರೌಸರ್ ಟೂಲ್ ಬಳಸಿ. ಕೋಡ್‌ನಲ್ಲಿ chroma.js, colord, ಅಥವಾ culori ಮುಂತಾದ ಲೈಬ್ರರಿಗಳು ಹಾರ್ಮನಿಗಳನ್ನು ಪ್ರೋಗ್ರಾಮ್ಯಾಟಿಕ್ ಆಗಿ ಲೆಕ್ಕಹಾಕಲು, ಅವನ್ನು ಡಿಸೈನ್-ಟೋಕನ್ ಬಿಲ್ಡ್ ಪೈಪ್‌ಲೈನ್‌ಗಳಲ್ಲಿ ಏಕೀಕರಿಸಲು, ಮತ್ತು ಇನ್ನಷ್ಟು ಸಮವಾಗಿ ಕಾಣುವ ಪ್ಯಾಲೆಟ್‌ಗಳಿಗಾಗಿ Oklch ಮುಂತಾದ ಪರ್ಸೆಪ್ಚುಯಲಿ ಯೂನಿಫಾರ್ಮ್ ಕಲರ್ ಸ್ಪೇಸ್‌ಗಳೊಂದಿಗೆ ಹಾರ್ಮನಿ ಗಣಿತವನ್ನು ಸಂಯೋಜಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತವೆ.