配色方案產生器
從任意基準色產生和諧的配色方案。支援互補色、鄰近色、三角色和單色方案。
Complementary
#6366F1#F1EE63Analogous
#63ADF1#6366F1#A763F1Triadic
#6366F1#F16366#66F163Split Complement
#6366F1#F1A763#ADF163Tetradic
#6366F1#F163AD#F1EE63#63F1A7Monochromatic
#0F13AC#1D21EB#6366F1#A1A3F7#D0D1FB什麼是配色方案產生器?
色彩理論根據色輪上的位置來定義和諧的色彩關係。互補色位於相對的位置(180°)。鄰近色彼此相鄰(30°)。三角配色方案使用三種等距的顏色(120°)。本工具會從你選定的基準色出發計算出每一種方案,為你提供一個建立在成熟色彩理論之上的起始調色盤。
常見問題
哪種方案最適合網站?▼
鄰近色(相近的色調)傳達出平靜與統一感。互補色為行動號召營造強烈對比。單色方案是最穩妥的專業選擇。
相關工具
顏色轉換工具(HEX/RGB/HSL)
在HEX、RGB和HSL格式之間轉換顏色。可視化選取顏色,或手動輸入數值。
CSS Box Shadow 產生器
以視覺化方式建立 CSS box-shadow 值。即時預覽並複製產生的 CSS。
CSS漸層產生器
建立線性和放射狀CSS漸層。以視覺化方式選擇顏色,並複製產生的CSS。
Cubic Bezier緩動曲線產生器
為CSS建立cubic-bezier緩動曲線。內建標準預設。
CSS Border Radius 產生器
以視覺化方式建立複雜的 CSS border-radius 值。可獨立控制每個圓角。
CSS Clamp()產生器
使用clamp()產生流式、響應式的CSS數值。在視口範圍內於最小值與最大值之間平滑縮放。