CSS框架中顏色的選擇對于網站的外觀和體驗起到了非常重要的作用，選擇正確的顏色可以提升用戶的閱讀與使用體驗，讓網站更加優雅和專業。以下是一些值得注意的事項和技巧。

//基礎顏色設置
:root{
--main-color:#6688cc;
--sub-color:#88cc66;
--bg-color:#f5f5f5;
}
//使用變量法引用
body{
background-color: var(--bg-color);
}
h1{
color: var(--main-color);
}
//使用工具集樣式
.btn{
background-color: var(--sub-color);
border: none;
color:#fff;
font-size:.8rem;
padding:.5rem 1rem;
border-radius:3px;
}
//調整顏色亮度
.btn:active{
filter: brightness(90%);
}
//顏色搭配
h2{
color: #267e7a; /*綠*/
}
p{
color: #939597; /*灰*/
}
//使用Less，保持顏色一致性
@main-color:#6688cc;
@sub-color:#88cc66;
@bg-color:#f5f5f5;
body{
background-color: @bg-color;
}
h1{
color: @main-color;
}

與網站風格相符合且又引人注目的顏色搭配，能夠幫助用戶更好、更快地融入到網站的世界里，提升用戶粘性。在選擇顏色時，可以通過調整取色器中的顏色亮度、飽和度等參數，找到最合適的顏色搭配。另外，使用變量法和Less等工具能夠提高編寫CSS的效率，避免出現顏色不一致等問題。