Multiple colour variables could be combined into a gradient using the native linear-gradient
function of CSS. You can read more about linear-gradient
at the MDN documentation page.
.selector {
background: linear-gradient(to right, var(--yellow-400), var(--yellow-600));
}
Feel free to play with this interactive example to get comfortable with the tool.