title: How to make a checkbox in circle shape with custom css?
body: <p>How do I make a checkbox rounded with custom CSS? Something similar to the image below. I know there are frameworks like bootstrap provides this, but I don't want to use a framework for this sole purpose as I'm already using angular material.</p>
  
  <p><a href="https://i.stack.imgur.com/ZBnGx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZBnGx.png" alt="enter image description here"></a></p>
  
  <p><strong>HTML Code:</strong></p>
  
  <pre><code>    &lt;label class="checkbox-inline"&gt;
          &lt;input type="checkbox" name="favoriteColors" ng-model="notification.checked"&gt; 
      &lt;/label&gt;
  </code></pre>
  
  <p>Thanks in Advance.</p>