• env()
• calc()
• var(—custom-property,)
  • https://medium.com/hypersphere-codes/counting-in-css-unlock-magic-of-css-variables-8e610881097a
• layer
• light-dark
• attr
• calc-size()
  • interpolate-size
• fit-content
• if
• sibling-index
• sibling-count
• progress

Math

• min

• max

• minmax

• repeat

• clamp(min, value, max) example: --sign: clamp(-1, var(--a)/var(--lim), 1);

• abs()

• sign()

• sin

• cos

• asin

• acos

• tan

• atan

• atan2

• hypot

• exp

• log

• mod 数学中的余数. 相当于 JavaScript 里面的: ((a % b) + b) % b

• rem 欧几里得中的余数(非负). 相当于 JavaScript 里面的: a % b

• round

• sqrt

counter

• counter
• counters

transform-function

• matrix
• matrix3d
• perspective
• rotate
• rotate3d
• rotateX
• rotateY
• rotateZ
• scale
• scale3d
• scaleX
• scaleY
• scaleZ
• skew
• skewX
• skewY
• translate
• translate3D
• translateX
• translateY
• translateZ

easing-function

• cubic-bezier
• linear
• step

animation-timeline

• scroll
• view

anchor

• anchor
• anchor-size
  • https://frontendmasters.com/blog/custom-range-slider-using-anchor-positioning-scroll-driven-animations/

basic-shape

• shape
• rect
• inset
• circle
• ellipse
• path
• polygon
• xywh
• ray

filter

• opacity
• blur
• brightness
• contrast
• drop-shadow
• grayscale
• hue-rotate
• invert
• saturate
• sepia

color

• color-mix
  • https://developer.chrome.com/docs/css-ui/css-color-mix
  • https://www.zhangxinxu.com/wordpress/2024/11/css-color-mix-function/
  • https://caniuse.com/?search=color-mix
• color
• device-cmyk
• rgb
• hsl
• hwb
• lab
• oklab
  • https://evilmartians.com/chronicles/oklch-in-css-why-quit-rgb-hsl
• lch
• oklch
• contrast-color

gradient/image

• conic-gradient
• linear-gradient
• radial-gradient
• repeating-conic-gradient
• repeating-linear-gradient
• repeating-radial-gradient
• image-set
• image
• paint
• url

其他

• palette-mix
• symbols
• element
• cross-fade

相关文章

• https://hypersphere.blog/blog/randomness-in-css-using-trigonometry/
• https://css-tricks.com/using-absolute-value-sign-rounding-and-modulo-in-css-today/
• https://medium.com/hypersphere-codes/randomness-in-css-b55a0845c8dd
• https://css-tricks.com/better-css-shapes-using-shape-part-1-lines-and-arcs/