@govbr-ds/core/dist/util/scrim/examples/scrim-behavior.html

Padrão Digital de Governo

<div class="br-scrim-util foco" id="scrimutilexample" data-scrim="true">
  <div class="br-modal medium" aria-labelledby="titulomodal">
    <div class="br-modal-dialog">
      <div class="br-modal-content">
        <div class="br-modal-header">
          <h1 class="br-modal-title" id="titulomodal">Scrim com Foco</h1>
        </div>
        <div class="br-modal-body">
          <p>Exemplo utilizando o componente scrim com FOCO</p>
        </div>
        <div class="br-modal-footer justify-content-center">
          <button class="br-button secondary" type="button" id="scrimfechar" data-dismiss="true">Cancelar
          </button>
          <button class="br-button primary mt-3 mt-sm-0 ml-sm-3" type="button">Retornar
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="actionscrimutil">
  <button class="br-button primary" type="button" id="idbuttonscrimutil">Abrir Modal
  </button>
</div>