demo · v139

Function Cookbook

Author-defined CSS functions. Declare with @function, call like any built-in. Pick a recipe and tweak the inputs — the rendered output updates live, and the function definition is right below.

Requires Chrome 139+ with --css-custom-functions enabled. The live preview here uses calc/color-mix as a stand-in so the page works everywhere — read the function definition below to see the @function form.

the function

see also