css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
user profile image

I tried to make almost all the iOS 7 icons with html + css. They aren't pixel perfect and there are bugs, but it was fun :) (made in 1 day... :D)


  1. This is madness! :D

  2. I wonder if anyone has taken their icon-grid and made a css template for that. Nice work!

  3. It's awesome Peter!!! Great work!

  4. Thank you!

  5. awesome work! I took a crack at the photos icon using SVG with some animation - would love to see it tweaked to fit a proper grid: http://codepen.io/mullany/pen/BkzKL

  6. Nice work! You went after some icons that I was afraid to touch (maps, newsstand, etc). Grab the code for the phone background if you want: http://codepen.io/tessat/pen/dqcCo

  7. They are great ! But are you sure about the corner radius ? It seems wrong to me.

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.