נפתרה: javascript hex ל-rgb

הבעיה העיקרית בהמרת ערכי צבע הקסדצימליים ל-RGB היא שאין התאמה של אחד לאחד בין שני הפורמטים. לדוגמה, הצבע #FF0000 מיוצג ב-RGB כ-255, 0, 0, אך ב-hex זה יהיה שווה לצבע #F0. משמעות הדבר היא שלשני צבעים שונים יכולים להיות אותו ערך RGB אם הם מורכבים מכמויות שונות של כל רכיב צבע.

"use strict";

function hexToRgb(hex) {
    var result = /^#?([a-fd]{2})([a-fd]{2})([a-fd]{2})$/i.exec(hex);
    return result ? {
        r: parseInt(result[1], 16),
        g: parseInt(result[2], 16),
        b: parseInt(result[3], 16)
    } : null;
}

"השתמש בקפדנות";

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

function hexToRgb(hex) {
var result = /^#?([a-fd]{2})([a-fd]{2})([a-fd]{2})$/i.exec(hex);
להחזיר תוצאה? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : ריק;
}

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

המרה בין צבעים

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

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

כדי להמיר צבע מפורמט פיקסל אחד לאחר, אתה יכול להשתמש בפונקציה css() . פונקציה זו לוקחת שני ארגומנטים: מחרוזת המייצגת את שם מאפיין ה-CSS (למשל "צבע") ומספר המייצג את הערך הרצוי עבור אותו מאפיין (למשל "50").

פורמטים של צבע

ישנם כמה פורמטים שונים של צבע שבהם אתה יכול להשתמש ב-JavaScript.

RGB - אדום, ירוק, כחול

HEX – #RRGGBB

HSL - גוון, רוויה, קלות

הודעות קשורות:

השאירו תגובה