Modificar a opacidade alfa da variável LESS

171

Usando LESS, sei que posso alterar a saturação ou matiz de uma variável de cor. É assim:

background: lighten(@blue, 20%);

Eu quero mudar a opacidade alfa da minha cor, no entanto. De preferência assim:

background: alpha(@blue, 20%);

Existe uma maneira simples de fazer isso no LESS?

css variables less opacity alpha

— ben
fonte

Respostas:

303

background: fade(@blue, 20%);

O nome da função fadenão está de alphaacordo com esse documento.

— ScottS
fonte

Obrigado! Estou cansado de converter tudo para RGBA!

— BillyNair

Eu estava procurando o escurecer e clarear .. Docs me levou lá. Graças

Concordo que 'desaparecer' não parece exato para mim. Sass faz o certo: alfa (), opacidade () e rgba ().

— Rich Finelli

Para o registro, fade()não funciona com CSS vars - iefade(var(--mycolor), 20%)

— ed1nh0 17/01/19

Para completar

desvaneça

Defina a transparência absoluta de uma cor. Pode ser aplicado às cores, se elas já possuem um valor de opacidade ou não.

background: fade(@blue, 20%);

aparecimento gradual

Diminua a transparência (ou aumente a opacidade) de uma cor, tornando-a mais opaca.

background: fadein(@blue, 80%);

desaparecer

Aumente a transparência (ou diminua a opacidade) de uma cor, tornando-a menos opaca. Para desaparecer na outra direção, use fadein.

background: fadeout(@blue, 20%);

— Adrian Enriquez
fonte

Fadeout é exatamente o que eu estava procurando, obrigado!

— precisa saber é o seguinte