title: Hide YouTube video controls (Title, Watch later, Share) using HTML / CSS / JavaScript
body: <p>I am embedding Youtube / Daily Motion Videos in my website...</p>
  
  <pre><code>&lt;iframe width="560" height="315" src="https://www.youtube.com/embed/an-6owXUwdg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""&gt;&lt;/iframe&gt;
  </code></pre>
  
  <p>I don't want the Youtube Videos Controls to be visible on my website... </p>
  
  <p>Please look at the attached files, i want to remove the controls which are at the top (Highlighted in Red Color) and also want to remove controls which are at the bottom (Highlighted in Red Color).</p>
  
  <p><a href="https://i.stack.imgur.com/j9W54.png" rel="noreferrer"><img src="https://i.stack.imgur.com/j9W54.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/7ssId.png" rel="noreferrer"><img src="https://i.stack.imgur.com/7ssId.png" alt="enter image description here"></a></p>
  
  <p>Previously it was possible in youtube videos using showinfo parameter. Now that parameter is deprecated, reference(<a href="https://developers.google.com/youtube/player_parameters#showinfo" rel="noreferrer">https://developers.google.com/youtube/player_parameters#showinfo</a>)</p>
  
  <p>Is there any other way to do that using HTML / CSS / JavaScript</p>
  
  <p>OR</p>
  
  <p>Can i run youtube videos on any player and can fulfill my requirements?</p>