整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
們在做網頁時，經常會用到十六進制顏色代碼，一個漂亮的網頁，它的顏色搭配必定有講究，下表是一些常用的顏色及十六進制顏色代碼對照，記錄在此，以便查閱！
CSSDA 工作人員整理
網頁設計中的顏色趨勢來來去去，但是好的色彩工具呢？我們認為是時候在網絡上四處走動，并檢查設計師色彩工具世界的運行狀態了。結果呢？事實證明，有一些非常酷的新方法來體驗顏色，你可能想看看。在本綜述中，我們匯總了目前可用的最佳色彩工具以及一些有史以來的經典。
Hailpixel提供了一種精美簡單的方法來查找顏色值并探索光譜。移動鼠標以瀏覽或使用箭頭鍵和滾動。Hailpixel由Devin Hunt設計，Devin Hunt是一位設計師和企業家，專注于設計，技術和創業的交叉點。
從最簡單的顏色工具到最全面的顏色工具之一，Adobe的Color CC（以前稱為Kuler）允許您瀏覽數千種配色方案，使用色輪創建自己的配色方案并與社區共享。
一個材料設計調色板生成器，允許您選擇自己喜歡的顏色，并生成和下載您的材料設計調色板。
假設您是一個經常使用顏色的網頁設計師，您需要在懸停狀態下使鏈接變亮或使按鈕的邊框變暗。根據創作者肖恩·查普曼（Shaun Chapman）的說法，0to255是適合您的工具。當然，對于基本顏色，您可能會依賴內存來存儲十六進制代碼，但是使用0to255，您可以選擇要開始的顏色，并使用針對網頁設計優化的間隔接收從黑色到白色的一系列顏色。然后，只需單擊要使用的變體，十六進制代碼就會自動復制到剪貼板。
有時，掌握基礎知識會有所幫助。147種顏色是Brian Maier的心血結晶，旨在幫助網頁設計師和開發人員學習HTML和CSS顏色規范中定義的147種顏色。147 種顏色由 17 種標準色和 130 種顏色組成。該值是顏色的名稱，而不是十六進制值或 RGB 值。單擊所有顏色的網格，單擊小刷新圖標以全屏獲取新顏色。
Shutterstock Spectrum 根據您在屏幕頂部滑塊中選擇的顏色顯示大小適中的圖像，非常方便獲得一些橫向靈感。您可以添加關鍵字以提高主題的準確性，并按亮度和平衡過濾圖像。
要使用Coolors，只需點擊空格鍵即可生成配色方案，然后單擊顏色以獲取組合。一些漂亮的調整工具和易于訪問的撤消和導出按鈕使冷卻器使用起來輕而易舉。由Web/app設計師和開發人員Fabrizio Bianchi創建。
Colrd允許您通過調色板，漸變，圖案和圖像創建和共享顏色靈感。Colrd呈現精美且易于使用，由一組色彩科學家為您帶來，他們專注于尋找在網絡上體驗色彩的新方法。
Paletton似乎永遠存在（以一種好的方式），但實際上是在2002年推出的。Paletton與其他顏色生成器（如上面提到的Adobe的Color CC）共享一些功能，但是您也可以從配色方案中選擇顏色，并有效地“挖掘”以找到新的顏色可能性。
ColorZilla于2004年推出，是Firefox和Chrome的擴展，具有先進的吸管，顏色選擇器，顏色分析器和其他好東西，而Ultimate Gradient Generator則提供了一個類似Photoshop的在線CSS漸變編輯器以及圖像到CSS轉換器等。
Checkmycolors 是一種工具，用于檢查所有 DOM 元素的前景色和背景色組合，并確定當遇到顏色缺陷的人查看時，它們是否提供足夠的對比度。
Hexu.al 以單詞的形式呈現十六進制值及其含義。嗯？例如，十六進制值#abaca5變成了單詞abacas，順便說一句，這顯然是來自菲律賓的大型植物。由Zach Wolf設計和開發。
如果你有一個需要柔和的大地色調的項目，Design Seeds值得一游。Design Seeds慶祝自然界中發現的顏色，于2009年推出，因此它有很多靈感。
Colorotate也可作為iPad應用程序使用，是一款主要用于創建調色板的工具，此外，您還可以瀏覽現有調色板，然后添加，混合和共享。Colorotate與其他類似產品的不同之處在于3D風格的色輪，并允許在調色板中使用五種以上顏色。
ColorHexa 提供有關任何顏色的信息。只需在搜索字段中鍵入顏色值，ColorHexa就會提供詳細的描述，并自動將其轉換為十六進制，二進制，RGB，CMYK，HSL，HSV，CIE-Lab，Hunter-Lab，CIE-Luv，CIE-LCH，XYZ和xyY的等效值。ColorHexa還將生成匹配的配色方案，例如互補，拆分互補，類似，三色，四色和單色顏色。
沒有COLOURlovers，任何顏色工具綜述都是不完整的，COLOURlovers是您應該已經了解的經典資源。用戶創建的超過800萬種顏色，370萬調色板和470萬種圖案，您很可能會找到有用的東西。畢竟，Twitter上超過150萬粉絲不會錯;)
Contrast-A是另一個“老古董但好東西”，由Annika Hamann（DasPlankton）于2009年1月創建。這個有趣的工具允許用戶試驗顏色組合，根據輔助功能指南檢查它們并創建自定義調色板。Contrast-A 檢查顏色組合的對比度是否可接受，并根據 WCAG 2.0（亮度比）以及較舊的輔助功能指南顯示結果。
不喜歡復雜的工具？不用擔心，拾色器可能只是你的東西。只需單擊表單字段即可激活色輪，或者只需輸入所需的十六進制值，拾色器就會提取免費顏色，三元組顏色和四元顏色。如果你想要一些無意識的娛樂，那么點擊隨機按鈕，重復，重復，重復，重復;)
這在我們為設計師尋找最佳色彩工具時結束。我們希望您找到一些感興趣的東西，并記得分享它們，以幫助創作者對創建這些有用的工具并免費提供它們感到一些愛。
編輯：塵淵文化
頭條創作挑戰賽#
顏色對于 css 來說是非常重要的，網站之所以會呈現出五彩斑斕的樣式，就是這些顏色樣式起的作用。在 css 中，對于顏色樣式有很多種表達方式，今天我們就來盤點下 css 中顏色的格式。
在 css 中，默認定義了很多名字顏色，比較常見的比如 yellow，blue，red，pink 等，實際上，css 中一共定義了 140 個顏色名字，這些名字你都可以直接拿來使用。雖然 140 種看起來很多，但是實際上它比 8bit 的顏色還要少，因此，平時我們很少使用它。
這是一種顏色格式，從名字我們就知道它是 red，green，blue 三種顏色的簡寫，我們都知道三原色原理，也就是通過三種基本顏色，我們就可以組合出其它的顏色出來，因此，rgb 就可以表示出我們可以看到的各種顏色。
在 css 中，red，green，blue 被稱作三通道，每個通道的值是從 0-255，通過混合這些通道顏色，我們就可以創造出 1600 多萬種顏色。需要注意的是 rgb(255,255,255,0.5) 允許我們有第四個參數，它的值從 0-1，用來表示透明度。
.translucent-box {
background: rgb(255 0 0 / 0.5);
}
通過十六進制數字來表示顏色代碼，6 位數字被分成了三組，每兩位一組，一位是 16，兩位就是 16*16=256，所以它其實和 RGB 基本是相同的，只不過它是用 16 進制進行表示。
它的三組也是代表著 red，green，blue，和 RGB 一樣的是，它也可以指定透明度，也就是說我們可以使用 8 位十六進制來表示顏色。
.translucent-box {
background: #ffff0080;
}
和 RGB 不同的是，HSL 是通過指定色調，飽和度，亮度來表示顏色的。
在 HSL 中，我們的色調是在 0deg-360deg 之間，轉一圈的大致顏色范圍就是紅橙黃綠青藍紫，飽和度是在 0-100%之間，亮度是在 0%-100%之間。
HSL 是可以和 RGB 進行轉換的，其中色調的轉換公式比較復雜。
.translucent-box {
background-color: hsl(0deg 100% 2%);
}
P3 是一個在繼承 sRGB 色彩空間范圍之外，又提供了更亮更充滿活力的色彩范圍，也就是說 P3 表示的色彩范圍要更大。
因此，使用 P3 的時候，需要使用特殊的屬性值 color 形式來表示，但是對于 color 這個屬性，目前只有 safari 支持。
.translucent-box {
background: color(display-p3 1 0 0);
}
因為 HSL 對于不同顏色在表示亮度的時候給人的感覺是不同的，因此，人們發明了 LCH 用來更接近人眼感知的色彩表示方式。
LCH 代表 “亮度色相”。“色度”或多或少是“飽和度”的同義詞。它在概念上與 HSL 非常相似，但有兩個很大的區別：
與我們看到的其他顏色格式不同，LCH 不受 sRGB 的約束。它甚至沒有綁定到 P3！它通過對色度沒有上限來實現這一點。
在 HSL 中，飽和度范圍從 0%（無飽和）到 100%（完全飽和）。這是可能的，因為我們知道我們正在談論 sRGB 色彩空間，一個有限的調色板。
但是 LCH 與特定的色彩空間無關，因此我們不知道飽和上限在哪里。它不是一成不變的：隨著顯示技術的不斷改進，我們可以期待顯示器達到越來越寬的色域。LCH 將自動能夠通過調高色度來引用這些擴展的顏色。談論面向未來！
.translucent-box {
background: lch(50% 120 20);
}
CSS 是一種令人驚訝的難以掌握的語言。無論花了多少年練習，總會覺得有很多我不知道的東西。
就目前而言，在 LCH 沒有被完全支持的情況下，HSL 也許更加適合表達。
所以說很多時候，當我們以為自己已經很熟悉或者掌握一門語言的時候，其實可能我們才僅僅是剛入門而已，任何知識當我們深入研究的時候我們都會發現我們對它的了解其實并不是真的很透徹。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
