返回兩種顏色相互兼容的算法

我在<div>中有一個<p>元素。段落文字有兩種可能的顏色：白色或黑色。這種顏色是在運行時隨機選擇的。背景div的顏色是在1600萬種顏色的運行時間中隨機選擇的。因爲這些過程都是隨機的，所以有時候類似的顏色會聚集在一起，並且段落文本很難看到或根本看不到。返回兩種顏色相互兼容的算法

是否有一種算法將兩種顏色相互比較，並以百分比的形式返回一個人看上去如何？

這個問題是問兩種顏色的相似程度：Color Logic Algorithm

我想知道怎樣一個看起來另一個層次的時候。例如，根據上述文章中定義的功能，黃色和白色不是相似的顏色，但是當白色寫入黃色時，文本不容易被看到。

來源

2012-10-12 Mark13426

聽起來你正試圖確定對比度。 – Brad

這個網站應該是幫助：

http://24ways.org/2010/calculating-color-contrast

根據它，使用此功能來確定是否使用黑色或白色的背景色：

function getContrastYIQ(hexcolor){ 
    var r = parseInt(hexcolor.substr(0,2),16); 
    var g = parseInt(hexcolor.substr(2,2),16); 
    var b = parseInt(hexcolor.substr(4,2),16); 
    var yiq = ((r*299)+(g*587)+(b*114))/1000; 
    return (yiq >= 128) ? 'black' : 'white'; 
}

當然，你將不得不將顏色轉換爲它們的十六進制值來使用它們。

來源

2012-10-12 02:41:10 PitaJ

sc-color library（披露：我是作者）有一個類似的內置函數contrastWhiteBlack()。

這是一個JsFiddle demo用於生成隨機背景顏色的文本顏色。

核心代碼看起來是這樣的：

// Parse, generate a contrast color, convert back to a color string 
var textColor = sc_color([color string to parse]).contrastWhiteBlack().html();

來源

2012-10-12 19:33:45 Ben

返回兩種顏色相互兼容的算法

回答

相關問題