歐幾里得距離打造色彩匹配庫：我的開發之旅

發佈於2025-03-13

顏色在設計，品牌和UX中至關重要。選擇合適的顏色對於任何產品或網站都至關重要，但是導航無數的陰影和色調可能具有挑戰性。本文詳細介紹了利用歐幾里得距離的顏色匹配庫的創建。 [2 The Journey to Building a Color-Matching Library with Euclidean Distance 此庫簡化了開發人員的顏色匹配，提供了幾個關鍵功能：

hex-to-rgb轉換：

將十六進制代碼轉換為更通用的RGB格式。 顏色匹配：標識給定調色板中最接近的顏色匹配。

使用Euclidean距離來測量兩種顏色之間的差異。

精確的匹配檢測：

此庫的簡單性和效率直接歸因於歐幾里得距離的使用。 [2
為什麼選擇Euclidean距離？
提供了顏色相似性的準確度量。 [2
精確的顏色匹配：

const {colorname，extcrectMatch，closeSthex} = sideencolor（“＃dd4c22”）; console.log（colorname）; //輸出：“生動的橙色” console.log（ecractMatch）; //輸出：true（如果完全匹配） console.log（clessEsthex）; //輸出：“＃dd4c22”（最近的十六進制代碼）

實用程序函數將十六進制轉換為rgb：

（rgb數組）

const rgb1 = [221，76，34]; const rgb2 = [255，255，255]; const距離=計算抑制（RGB1，RGB2）; console.log（距離）; //輸出：代表距離的數字值

精確匹配檢測： exactMatch
此庫簡化了開發人員和設計師的顏色選擇和匹配。
入門

const {sigensColor} = require（“@iamsuz/color-kit”）; const {colorRANM，coldesthex，extercMatch} = sideencolor（“＃dd4c22”）; console.log（colorname）; //“生動的橙色” console.log（ecractMatch）; // 真的 console.log（clessEsthex）; //“＃dd4c22”

此庫提供了打字稿支持。