How can I specify inner elements template in custom login page? I am new in Drupal 8. I want to create a new theme to according to my HTML. What is the best practice to integrating a custom build theme to drupal engine.

I have covered all sections in Drupal 8 theming tutorial. Now I need to integrate custom login page.

I have added the following hook inside mytheme.theme file

function wms_aupl_theme(&amp;$existing, $type, $theme, $path) {
  $hooks = array();  
  $hooks['user_login_form'] = array(         
      'render element' =&gt; 'form',
      'template' =&gt; 'user-login-form',
  );  
  return $hooks;
}


And Inserted my HTML in user-login-form.html.twig file as follows.

&lt;div class="col-xs-12"&gt;
    &lt;div class="reg-form-2-wrap"&gt;
        &lt;form{{ attributes.addClass('user-login') }}&gt;
            &lt;div class="row"&gt;
                &lt;div class="col-xs-12"&gt;
                    &lt;h1 class="main-head"&gt;Auktionsplattform&lt;/h1&gt;
                &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="row"&gt;
                &lt;div class="col-xs-12"&gt;
                    &lt;label class="gen-reg-label-small"&gt;Some dummy content&lt;/label&gt;
                &lt;/div&gt;
            &lt;/div&gt;
            {{ form.name['#title'] }}
            &lt;div class="row mrgn-top-30"&gt;
                &lt;div class="row mrgn-top-30"&gt;
                    &lt;div class="col-xs-3"&gt;
                        &lt;label class="gen-reg-label"&gt;  &lt;/label&gt;
                    &lt;/div&gt;
                    &lt;div class="col-xs-9"&gt;
                        {{ form.name. }}
                    &lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="row"&gt;
                {{ form.pass }}
                &lt;label class="gen-reg-label-pass"&gt;&lt;a href="{{ base_url }}/user/password" class="reg-terms-anch"&gt;Passwort vergessen&lt;/a&gt;&lt;/label&gt;                
            &lt;/div&gt;
            {{ form.form_build_id }}
            {{ form.form_id }}
            &lt;div class="row mrgn-top-30"&gt;
                &lt;div class="col-xs-12"&gt;
                    {{ form.actions }}
                &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="row"&gt;
                &lt;div class="col-xs-12"&gt;
                    &lt;label class="gen-reg-label-small"&gt;Noch kein Konto? &lt;a href="{{ base_url }}/user/register" class="reg-terms-anch"&gt;Hier registrieren&lt;/a&gt;&lt;/label&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/form&gt;
    &lt;/div&gt;
&lt;/div&gt;


Now i need to specify inner element's template. How can I specify inner elements template?

Is there any better way to do this?
See How to manipulate forms in Drupal 8:


  To make changes to the fields in your form, you have to change the specific twig templates. First check which twig templates correspond with the base theme of your Drupal application. It is important that you give new twig templates the same name as the original ones, otherwise your new templates will not be recognized.