創建顏色調色板從基色

Question

我需要實現一個網站（ASP.net MVC製造）的主題化開始。

的想法是，在用戶選取一種顏色（底色），並從它，我必須生成：

• 懸停狀態的顏色（輕40％）
• 按壓狀態的顏色（20％打火機）
• 顏色較深（20％較暗）

我試圖讓執行，但我知道這不正常。

如果用戶將較亮的顏色，然後懸停狀態會變得幾乎看不見。

搜索互聯網，我發現這個link這似乎正是我要找的，但我無法找到一個真實的例子。

有沒有做什麼，我想實現的任何項目或例子嗎？

Answer 1

您可以使用JavaScript客戶端做到這一點。

建議的方法：在使用RGB值

1. 皮克基色。
2. RGB轉換到HSL
3. 增減HSL亮度RGB轉換
4. HSL轉換回RGB
5. 到CSS兼容的十六進制和你的主題使用。

做你的HSL/RGB轉換，您可以使用此：

http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript

這裏是您可以修改轉換你的RGB值十六進制的例子

How to convert decimal to hex in JavaScript?

這裏是W3Schools頁面的顏色了。也許不直接關係到你的問題，但可能仍然是有用的

http://www.w3schools.com/cssref/css_colors.asp

Answer 2

訣竅是不要讓用戶選擇一個隨機的顏色了全RGB空間。相反，讓他們只選擇通過色調的基本顏色，並設置自己的飽和度和亮度。 Color類本身已經有方法來檢索這個值，但缺乏從這些值創建顏色的支持。這可以通過this answer來實現。

通過這種方法，你乾脆讓用戶只選擇基本顏色，所以你保證更輕和較暗的顏色是可能的。如何做到這一點的令人印象深刻的方式可以在Color Scheme Designer（你可能已經知道）內看到。他們也只能在第一步中選擇色調。

Answer 3

儘管以下示例正在運行，但您需要了解顏色的數學運算才能正常工作（如果顏色太亮，太暗，色調和其他顏色）。

我發現了另一種做法，正是我所需要的。這裏是link。

它將基本顏色與50％不透明度的白色混合，使顏色變淺。