VS Code Extention to auto generate CSS code

Question

I'm looking for an extension to auto-generate CSS code based on HTML structure code: Example: let's pretend I write the following code manually

<section class="login">
  <div class="login-grid">
     <div class="login-form"></div>
  </div>
</section>

I'd like to have the following code automatically in the CSS file with the same structure

.login {
    .login-grid 
    {
        .login-form{

        }
    }
    
}

Answer 1

Try HTML CSS support extension

https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css