Sobreposições
Fundo de sobreposição
Backdrop / Scrim
Uma camada atrás de um painel que reduz o destaque do restante da página.
Esta é a superfície.
A camada atrás é o backdrop.Exemplo didático · Representação visual do padrão
Quando usar
Sinalizar o foco de uma interação modal.
Cuidados e acessibilidade
Escurecer não bloqueia interação por si só; implemente também o comportamento modal.
Partes e comportamento
Camada de fundo entre a página e a superfície sobreposta.
Não confunda
Overlay é um termo amplo; backdrop descreve a camada que fica atrás da superfície.
Exemplo de código
dialog::backdrop {
background: rgb(20 18 30 / 55%);
backdrop-filter: blur(4px);
}Trecho didático. Integre e teste no contexto do seu projeto.