Categories for CSS Tricks

Create different shapes with CSS

December 1, 2018 2:30 pm Published by Leave your thoughts

  Here you’ll find a range off shapes all coded with just pure CSS3 code. Unfortunately not all shapes will render correctly in all browsers, currently only web browsers that support CSS3 will produce the correct geometric shapes. Square #square { width: 140px; height: 140px; background: blue; } Circle #circle { width: 140px; height: 140px; background: blue; -moz-border-radius: 70px; -webkit-border-radius: 70px; border-radius: 70px; } Oval #oval { width: 200px; height: 100px; background: blue; -moz-border-radius: 100px... View Article