umbrUI is a demo of HTML <input> elements styled with CSS3. There are: No images, no extra markup and no JavaScript. If you use appearance: none, it will remove the default styles and you’re free to add your own.

input[type="checkbox"] {
-webkit-appearance:none; /* Remove default styles */
/* Add your own styles */
}

So I used as many of the :before and :after pseudo elements as possible and well as the Shadow DOM elements. Browser support: WebKit for now.

Credits: The Rocker switch (checkbox) is based on Mike Bernardo’s original design.

See the demo (Safari or Chrome).

  1. anunturi-daniela reblogged this from simurai
  2. hot-yoga-benefits reblogged this from simurai
  3. price-per-head reblogged this from simurai
  4. pixelkoncept reblogged this from simurai
  5. jessicakmn reblogged this from simurai
  6. jeen-hao reblogged this from four-wheeler
  7. idmserial reblogged this from four-wheeler
  8. four-wheeler reblogged this from simurai and added:
    Brent Everett Parole Officer
  9. ashowtimes reblogged this from simurai
  10. rooftopglows reblogged this from simurai and added:
    This looks so good!
Feed me