Preview:
           <!-- no-outline input text field -->
           <div class="no-outline-text-input">
               <label for="text">Name
                   <input type="text" name="text" autocomplete="name" placeholder="enter name" />
               </label>
           </div>

           <!-- no-outline input email field -->
           <div class="no-outline-email-input">
               <label for="email">Email *
                   <input type="email" name="email" required autocomplete="email" placeholder="enter email" />
               </label>
           </div>

           <!-- no-outline input password field -->
           <div class="no-outline-password-input">
               <label for="password">Password *
                   <input type="password" name="password" autocomplete="current-password" placeholder="enter password" required value="..." />
                   wrong password, try again
               </label>
           </div>

           <!-- no-outline input number field -->
           <div class="no-outline-number-input">
               <label for="number">Number<input type="number" name="number" placeholder="enter quantity" />
               </label>
           </div>

           <!-- no-outline input date field -->
           <div class="no-outline-date-input">
               <label for="date">Date<input type="date" name="date" />
               </label>
           </div>

           <!-- no-outline input month field -->
           <div class="no-outline-month-input">
               <label for="month">Month<input type="month" name="month" />
               </label>
           </div>

           <!-- no-outline input file field -->
           <div class="no-outline-file-input">
               <label for="file">File<input type="file" name="file" />
               </label>
           </div>

           <!-- no-outline input telephone field -->
           <div class="no-outline-tel-input">
               <label for="tel">Phone no<input type="tel" autocomplete="tel" name="tel" placeholder="enter phone number" />
               </label>
           </div>
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter