From 0ef3160eca93a670eafc7e7b796a127758535020 Mon Sep 17 00:00:00 2001 From: pvictor Date: Sat, 4 Jan 2025 23:51:48 +0200 Subject: [PATCH 1/5] snippets: hex to rgb color --- public/consolidated/c.json | 2 +- public/consolidated/javascript.json | 11 +++++++++ .../color-manipulation/hex-to-rgb-color.md | 24 +++++++++++++++++++ 3 files changed, 36 insertions(+), 1 deletion(-) create mode 100644 snippets/javascript/color-manipulation/hex-to-rgb-color.md diff --git a/public/consolidated/c.json b/public/consolidated/c.json index 1588cd69..a9258611 100644 --- a/public/consolidated/c.json +++ b/public/consolidated/c.json @@ -38,7 +38,7 @@ "numbers" ], "contributors": [], - "code": "#include\nvoid swap(int* num1,int* num2){\n *num1 = *num1 + *num2;\n *num2 = *num1 - *num2;\n *num1 = *num1 - *num2;\n}\n\n// Usage:\nint a = 3,b = 4;\nswap(&a,&b); // simply use printf after this to print swapped values\n" + "code": "#include\nvoid swap(int* num1,int* num2){\n *num1 = *num1 + *num2;\n *num2 = *num1 - *num2;\n *num1 = *num1 - *num2;\n}\n\n// Usage:\nint a = 3,b = 4;\nswap(&a,&b); // swaps the values of the a and b variables\n" } ] } diff --git a/public/consolidated/javascript.json b/public/consolidated/javascript.json index 2e8c8f97..72ef536e 100644 --- a/public/consolidated/javascript.json +++ b/public/consolidated/javascript.json @@ -80,6 +80,17 @@ { "categoryName": "Color Manipulation", "snippets": [ + { + "title": "Hex to RGB Color", + "description": "Converts hexadecimal color code to RGB color values.", + "author": "pvictordev", + "tags": [ + "color", + "conversion" + ], + "contributors": [], + "code": "function hexToRgb(r, g, b) {\n return (\n \"#\" +\n [r, g, b]\n .map((x) => {\n const hex = x.toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n })\n .join(\"\")\n );\n},\n\n// Usage:\nconsole.log(hexToRgb(\"#ff5733\")); // { r: 255, g: 87, b: 51 }\nconsole.log(hexToRgb(\"#ffff\")); // { r: 0, g: 255, b: 255 }\n" + }, { "title": "RGB to Hex Color", "description": "Converts RGB color values to hexadecimal color code.", diff --git a/snippets/javascript/color-manipulation/hex-to-rgb-color.md b/snippets/javascript/color-manipulation/hex-to-rgb-color.md new file mode 100644 index 00000000..5ff39cd5 --- /dev/null +++ b/snippets/javascript/color-manipulation/hex-to-rgb-color.md @@ -0,0 +1,24 @@ +--- +title: Hex to RGB Color +description: Converts hexadecimal color code to RGB color values. +author: pvictordev +tags: color,conversion +--- + +```js +function hexToRgb(r, g, b) { + return ( + "#" + + [r, g, b] + .map((x) => { + const hex = x.toString(16); + return hex.length === 1 ? "0" + hex : hex; + }) + .join("") + ); +}, + +// Usage: +console.log(hexToRgb("#ff5733")); // { r: 255, g: 87, b: 51 } +console.log(hexToRgb("#ffff")); // { r: 0, g: 255, b: 255 } +``` \ No newline at end of file From 4f58819a56ab07b308b9acb013e64f434c90d867 Mon Sep 17 00:00:00 2001 From: pvictor Date: Sat, 4 Jan 2025 23:53:22 +0200 Subject: [PATCH 2/5] snippets: rgb to hsl color --- public/consolidated/javascript.json | 11 +++++ .../color-manipulation/rgb-to-hsl-color.md | 42 +++++++++++++++++++ 2 files changed, 53 insertions(+) create mode 100644 snippets/javascript/color-manipulation/rgb-to-hsl-color.md diff --git a/public/consolidated/javascript.json b/public/consolidated/javascript.json index 72ef536e..2379d9c7 100644 --- a/public/consolidated/javascript.json +++ b/public/consolidated/javascript.json @@ -101,6 +101,17 @@ ], "contributors": [], "code": "function rgbToHex(r, g, b) {\n const toHex = (n) => {\n const hex = n.toString(16);\n return hex.length === 1 ? '0' + hex : hex;\n };\n \n return '#' + toHex(r) + toHex(g) + toHex(b);\n}\n\n// Usage:\nconsole.log(rgbToHex(255, 128, 0)); // Output: \"#ff8000\"\nconsole.log(rgbToHex(0, 255, 0)); // Output: \"#00ff00\"\n" + }, + { + "title": "RGB to HSL Color", + "description": "Converts RGB color values to HSL color values.", + "author": "pvictordev", + "tags": [ + "color", + "conversion" + ], + "contributors": [], + "code": "function rgbToHsl(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n const max = Math.max(r, g, b),\n min = Math.min(r, g, b);\n let h, s, l;\n l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0;\n } else {\n const d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n }\n h /= 6;\n }\n return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) };\n}\n\n// Usage:\nconsole.log(rgbToHsl(255, 87, 51)); // { h: 14, s: 100, l: 60 }\nconsole.log(rgbToHsl(255, 255, 255)); // { h: 0, s: 0, l: 100 }\n" } ] }, diff --git a/snippets/javascript/color-manipulation/rgb-to-hsl-color.md b/snippets/javascript/color-manipulation/rgb-to-hsl-color.md new file mode 100644 index 00000000..d333e043 --- /dev/null +++ b/snippets/javascript/color-manipulation/rgb-to-hsl-color.md @@ -0,0 +1,42 @@ +--- +title: RGB to HSL Color +description: Converts RGB color values to HSL color values. +author: pvictordev +tags: color,conversion +--- + +```js +function rgbToHsl(r, g, b) { + r /= 255; + g /= 255; + b /= 255; + const max = Math.max(r, g, b), + min = Math.min(r, g, b); + let h, s, l; + l = (max + min) / 2; + + if (max === min) { + h = s = 0; + } else { + const d = max - min; + s = l > 0.5 ? d / (2 - max - min) : d / (max + min); + switch (max) { + case r: + h = (g - b) / d + (g < b ? 6 : 0); + break; + case g: + h = (b - r) / d + 2; + break; + case b: + h = (r - g) / d + 4; + break; + } + h /= 6; + } + return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) }; +} + +// Usage: +console.log(rgbToHsl(255, 87, 51)); // { h: 14, s: 100, l: 60 } +console.log(rgbToHsl(255, 255, 255)); // { h: 0, s: 0, l: 100 } +``` \ No newline at end of file From 5036b30fdc21d0fffe5142e9aa6dbd7b11eedbbe Mon Sep 17 00:00:00 2001 From: pvictor Date: Sun, 5 Jan 2025 00:03:49 +0200 Subject: [PATCH 3/5] snippets: hsl to rgb color --- public/consolidated/javascript.json | 11 ++++++ .../color-manipulation/hsl-to-rgb-color.md | 34 +++++++++++++++++++ 2 files changed, 45 insertions(+) create mode 100644 snippets/javascript/color-manipulation/hsl-to-rgb-color.md diff --git a/public/consolidated/javascript.json b/public/consolidated/javascript.json index 2379d9c7..9e5ea5e6 100644 --- a/public/consolidated/javascript.json +++ b/public/consolidated/javascript.json @@ -91,6 +91,17 @@ "contributors": [], "code": "function hexToRgb(r, g, b) {\n return (\n \"#\" +\n [r, g, b]\n .map((x) => {\n const hex = x.toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n })\n .join(\"\")\n );\n},\n\n// Usage:\nconsole.log(hexToRgb(\"#ff5733\")); // { r: 255, g: 87, b: 51 }\nconsole.log(hexToRgb(\"#ffff\")); // { r: 0, g: 255, b: 255 }\n" }, + { + "title": "HSL to RGB Color", + "description": "Converts HSL color values to RGB color values.", + "author": "pvictordev", + "tags": [ + "color", + "conversion" + ], + "contributors": [], + "code": "function hslToRgb(h, s, l) {\n s /= 100;\n l /= 100;\n const c = (1 - Math.abs(2 * l - 1)) * s;\n const x = c * (1 - Math.abs((h / 60) % 2 - 1));\n const m = l - c / 2;\n\n const [r, g, b] = \n h < 60 ? [c, x, 0] :\n h < 120 ? [x, c, 0] :\n h < 180 ? [0, c, x] :\n h < 240 ? [0, x, c] :\n h < 300 ? [x, 0, c] :\n [c, 0, x];\n\n return {\n r: Math.round((r + m) * 255),\n g: Math.round((g + m) * 255),\n b: Math.round((b + m) * 255),\n };\n}\n\n// Usage:\nconsole.log(hslToRgb(14, 100, 60)); // { r: 255, g: 87, b: 51 }\nconsole.log(hslToRgb(0, 0, 100)); // { r: 255, g: 255, b: 255 }\n" + }, { "title": "RGB to Hex Color", "description": "Converts RGB color values to hexadecimal color code.", diff --git a/snippets/javascript/color-manipulation/hsl-to-rgb-color.md b/snippets/javascript/color-manipulation/hsl-to-rgb-color.md new file mode 100644 index 00000000..23390237 --- /dev/null +++ b/snippets/javascript/color-manipulation/hsl-to-rgb-color.md @@ -0,0 +1,34 @@ +--- +title: HSL to RGB Color +description: Converts HSL color values to RGB color values. +author: pvictordev +tags: color,conversion +--- + +```js +function hslToRgb(h, s, l) { + s /= 100; + l /= 100; + const c = (1 - Math.abs(2 * l - 1)) * s; + const x = c * (1 - Math.abs((h / 60) % 2 - 1)); + const m = l - c / 2; + + const [r, g, b] = + h < 60 ? [c, x, 0] : + h < 120 ? [x, c, 0] : + h < 180 ? [0, c, x] : + h < 240 ? [0, x, c] : + h < 300 ? [x, 0, c] : + [c, 0, x]; + + return { + r: Math.round((r + m) * 255), + g: Math.round((g + m) * 255), + b: Math.round((b + m) * 255), + }; +} + +// Usage: +console.log(hslToRgb(14, 100, 60)); // { r: 255, g: 87, b: 51 } +console.log(hslToRgb(0, 0, 100)); // { r: 255, g: 255, b: 255 } +``` \ No newline at end of file From f71db888b37c1380cc3410e0c3cfc58c1800a57a Mon Sep 17 00:00:00 2001 From: pvictor Date: Sun, 5 Jan 2025 00:07:38 +0200 Subject: [PATCH 4/5] refactor: optimized rgb to hsl color --- public/consolidated/javascript.json | 2 +- .../color-manipulation/rgb-to-hsl-color.md | 49 +++++++++---------- 2 files changed, 23 insertions(+), 28 deletions(-) diff --git a/public/consolidated/javascript.json b/public/consolidated/javascript.json index 9e5ea5e6..d2293838 100644 --- a/public/consolidated/javascript.json +++ b/public/consolidated/javascript.json @@ -122,7 +122,7 @@ "conversion" ], "contributors": [], - "code": "function rgbToHsl(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n const max = Math.max(r, g, b),\n min = Math.min(r, g, b);\n let h, s, l;\n l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0;\n } else {\n const d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n }\n h /= 6;\n }\n return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) };\n}\n\n// Usage:\nconsole.log(rgbToHsl(255, 87, 51)); // { h: 14, s: 100, l: 60 }\nconsole.log(rgbToHsl(255, 255, 255)); // { h: 0, s: 0, l: 100 }\n" + "code": "function rgbToHsl(r, g, b) {\n [r, g, b] = [r, g, b].map((v) => v / 255);\n\n const max = Math.max(r, g, b);\n const min = Math.min(r, g, b);\n const delta = max - min;\n\n const l = (max + min) / 2;\n\n if (delta === 0) return { h: 0, s: 0, l: Math.round(l * 100) };\n\n const s = l > 0.5 ? delta / (2 - max - min) : delta / (max + min);\n\n const h = \n max === r ? ((g - b) / delta + (g < b ? 6 : 0)) :\n max === g ? (b - r) / delta + 2 :\n (r - g) / delta + 4;\n\n return {\n h: Math.round(h * 60), \n s: Math.round(s * 100),\n l: Math.round(l * 100), \n };\n}\n\n// Usage:\nconsole.log(rgbToHsl(255, 87, 51)); // { h: 14, s: 100, l: 60 }\nconsole.log(rgbToHsl(255, 255, 255)); // { h: 0, s: 0, l: 100 }\n" } ] }, diff --git a/snippets/javascript/color-manipulation/rgb-to-hsl-color.md b/snippets/javascript/color-manipulation/rgb-to-hsl-color.md index d333e043..51e29a86 100644 --- a/snippets/javascript/color-manipulation/rgb-to-hsl-color.md +++ b/snippets/javascript/color-manipulation/rgb-to-hsl-color.md @@ -7,33 +7,28 @@ tags: color,conversion ```js function rgbToHsl(r, g, b) { - r /= 255; - g /= 255; - b /= 255; - const max = Math.max(r, g, b), - min = Math.min(r, g, b); - let h, s, l; - l = (max + min) / 2; - - if (max === min) { - h = s = 0; - } else { - const d = max - min; - s = l > 0.5 ? d / (2 - max - min) : d / (max + min); - switch (max) { - case r: - h = (g - b) / d + (g < b ? 6 : 0); - break; - case g: - h = (b - r) / d + 2; - break; - case b: - h = (r - g) / d + 4; - break; - } - h /= 6; - } - return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) }; + [r, g, b] = [r, g, b].map((v) => v / 255); + + const max = Math.max(r, g, b); + const min = Math.min(r, g, b); + const delta = max - min; + + const l = (max + min) / 2; + + if (delta === 0) return { h: 0, s: 0, l: Math.round(l * 100) }; + + const s = l > 0.5 ? delta / (2 - max - min) : delta / (max + min); + + const h = + max === r ? ((g - b) / delta + (g < b ? 6 : 0)) : + max === g ? (b - r) / delta + 2 : + (r - g) / delta + 4; + + return { + h: Math.round(h * 60), + s: Math.round(s * 100), + l: Math.round(l * 100), + }; } // Usage: From 755ae1742f7a84ee6cb08adb85e9d32618fe9457 Mon Sep 17 00:00:00 2001 From: pvictor Date: Sun, 5 Jan 2025 09:19:32 +0200 Subject: [PATCH 5/5] fix: hex to rgb color --- public/consolidated/javascript.json | 2 +- .../color-manipulation/hex-to-rgb-color.md | 26 +++++++++++-------- 2 files changed, 16 insertions(+), 12 deletions(-) diff --git a/public/consolidated/javascript.json b/public/consolidated/javascript.json index d2293838..d6f23739 100644 --- a/public/consolidated/javascript.json +++ b/public/consolidated/javascript.json @@ -89,7 +89,7 @@ "conversion" ], "contributors": [], - "code": "function hexToRgb(r, g, b) {\n return (\n \"#\" +\n [r, g, b]\n .map((x) => {\n const hex = x.toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n })\n .join(\"\")\n );\n},\n\n// Usage:\nconsole.log(hexToRgb(\"#ff5733\")); // { r: 255, g: 87, b: 51 }\nconsole.log(hexToRgb(\"#ffff\")); // { r: 0, g: 255, b: 255 }\n" + "code": "function hexToRgb(hex) {\n let sanitizedHex = hex.startsWith(\"#\") ? hex.slice(1) : hex;\n\n if (sanitizedHex.length === 3) {\n sanitizedHex = [...sanitizedHex].map((char) => char + char).join(\"\");\n }\n\n const bigint = parseInt(sanitizedHex, 16);\n\n return {\n r: (bigint >> 16) & 0xff, \n g: (bigint >> 8) & 0xff, \n b: bigint & 0xff, \n };\n}\n\n// Usage:\nconsole.log(hexToRgb(\"#ff5733\")); // { r: 255, g: 87, b: 51 }\nconsole.log(hexToRgb(\"#ffff\")); // { r: 0, g: 255, b: 255 }\n" }, { "title": "HSL to RGB Color", diff --git a/snippets/javascript/color-manipulation/hex-to-rgb-color.md b/snippets/javascript/color-manipulation/hex-to-rgb-color.md index 5ff39cd5..3d0108d1 100644 --- a/snippets/javascript/color-manipulation/hex-to-rgb-color.md +++ b/snippets/javascript/color-manipulation/hex-to-rgb-color.md @@ -6,17 +6,21 @@ tags: color,conversion --- ```js -function hexToRgb(r, g, b) { - return ( - "#" + - [r, g, b] - .map((x) => { - const hex = x.toString(16); - return hex.length === 1 ? "0" + hex : hex; - }) - .join("") - ); -}, +function hexToRgb(hex) { + let sanitizedHex = hex.startsWith("#") ? hex.slice(1) : hex; + + if (sanitizedHex.length === 3) { + sanitizedHex = [...sanitizedHex].map((char) => char + char).join(""); + } + + const bigint = parseInt(sanitizedHex, 16); + + return { + r: (bigint >> 16) & 0xff, + g: (bigint >> 8) & 0xff, + b: bigint & 0xff, + }; +} // Usage: console.log(hexToRgb("#ff5733")); // { r: 255, g: 87, b: 51 }