常使用的 Functions

• Functional selectors：例如 :is()、:not() 選擇器
• Custom properties：使用 -- 做宣告，再使用 var(--variable-name)取值
• Reference functions
  • attr()取得元素的屬性值
  • env() 瀏覽器的環境變數值
  • url() 引入外部資源
• Color functions：rgb()、rgba()、hsl() ...等
• Mathematical expressions
  • calc() 數值運算
  • min()、max() 取最大或最小值
  • clamp(min, val, max)：將值限制在最大和最小值之間
• Shapes
  • circle() 繪製圓形
  • ellipse() 繪製橢圓形
  • polygon() 繪製多邊形
  • inset() 繪製矩形
• Transforms
  • rotate() 旋轉
  • scale() 縮放
  • translate() 平移
  • skew() 傾斜
• Animation
  • cubic-bezier() 用於 timing-function 的貝茲曲線函數
  • path() 使用 SVG 或是自訂路徑來建立各種形狀
  • steps() 將動畫切成指定段數
• Gradients
• Filters

補充

CSS Functions Cheat Sheet

圖取自 reddit - CSS Functions - 1 Cheat Sheet

參考資源

CSS TRICKS - CSS Functions Guide