1. CSS 變數（CSS Variables）

CSS 變數允許我們在樣式表中定義可重複使用的值，這有助於提高程式碼的可維護性和一致性。透過在根元素中定義變數，我們可以在整個樣式表中引用這些變數，實現統一管理。例如，定義主要顏色、次要顏色和基礎字體大小等變數，然後在需要的地方引用，這樣當需要修改某個值時，只需更改變數的定義即可，避免在多處手動更新。

2. 混合模式（mix-blend-mode）

混合模式使元素的內容與其背景或父元素的內容進行混合，創造出多種視覺效果，類似於 Photoshop 的圖層混合模式。常見的混合模式包括：

normal：正常顯示，無混合效果。
multiply：相乘，結果色比原色更暗。
screen：濾色，結果色比原色更亮。
overlay：覆蓋，結合相乘和濾色效果。
例如，設定某個元素的混合模式為 overlay，該元素的內容將與其背景進行覆蓋混合，產生特殊的視覺效果。

3. 過濾器（filter）

過濾器允許我們對元素應用圖形效果，如模糊、灰階、亮度調整等。常用的過濾器包括：

blur：模糊效果。
grayscale：灰階效果。
brightness：亮度調整。
contrast：對比度調整。
透過這些過濾器，我們可以在不修改原始圖片的情況下，實現多種視覺效果。例如，對某個圖片元素應用模糊或灰階過濾器，能夠快速實現相應的效果，提升設計的靈活性。

掌握這些進階的 CSS 技巧，能夠讓我們在設計響應式網頁時，創造出更豐富的視覺效果，同時提高程式碼的可維護性。