Este é um exemplo de #modal Black com #bootstrap 5. estes componentes podem ser utilizados para login. informação antes de alguma ação que o usuário venha a acionar, pode também ser utilizado para formulário de contato e cadastro.

Código

 <div class="container mt-3">
 <div class="row">
 <div class="col-12">
 <a href="#my_modal" data-bs-toggle="modal">Abrir a modal de exemplo</a>
 </div>
 </div>
 </div>
 <!-- Modal -->
 <div id="my_modal" class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
 <div class="modal-dialog modal-dialog-centered modal-fullscreen-sm-down">
 <div class="modal-content bg-dark bg-gradient opacity-90">
 <div class="modal-body p-0 border border-5 border-secondary rounded-3">
 <div class="row">
 <div class="col-12">
 <div class="text-center mb-2 text-white fs-3">
 Support
 </div>
 <div class="text-center custom-height">
 <i class="d-block bi bi-person-circle text-white mb-2 big-icon"></i>
 </div>
 <div class="bg-dark text-white custom-height p-3">
 Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type
 specimen book. It has
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 <script>
 window.addEventListener("load", function(event) {

 let myModalElement = document.getElementById('my_modal');
 let myModal = new bootstrap.Modal(myModalElement, {
 keyboard: true
 });
 
 // Se a modal for carregada junto com a página
 // myModal.show();

 myModalElement.addEventListener('show.bs.modal', function(event) {
 console.log('modal load');
 })

 console.log("Todos os recursos terminaram o carregamento!");
 });
 </script>