Функции в CSS! Уже доступны в Chrome 139

/* Функции в CSS */

/* Возвращает полупрозрачный цвет */
@function --opacity(--color, --opacity) {
  result: rgb(from var(--color) r g b / var(--opacity));
}

/* Используем нашу функцию --opacity */
div {
  background: --opacity(blue, 80%);
}

/* Также можно использовать с кастомными свойствами */
.article {
  border-color: --opacity(
    var(--color-primary),
    var(--semi-transparent)
  );
}

Теперь можно создавать собственные функции прямо в CSS, передавать в них параметры и использовать вместе с custom properties

@WebDev_Plus