• Skip to primary navigation
  • Skip to content

Coppertops Digital Marketing

Let Coppertops Digital Marketing light your way

  • Home
  • Website Design
  • Design
  • Social Media
  • Training
  • SEO Services
  • Contact Us

The Beautiful side of CSS

September 16, 2014 by Andrea

Most people who have put together a website have at least heard of CSS. Cascading Style Sheets allow you to set custom styling on your website which remains consistent across all pages and all items of the same type. It allows some creative designs on items. For some, it can be more creative even than that. A number of people are exploring how to create images entirely based on CSS for websites. You may ask why on earth anybody would want to do that, and there are a number of reasons. Firstly, coders always fancy a challenge, to see how far they can push something and try to produce more powerful results. Simpler than that though is the fact that, in general, a CSS generated image is massively lighter than a jpg/png image. This means that your page loads faster on your visitor’s browser, and the faster the page loads the less likely they are to leave before they see your content!

Roman Cortes

Roman Cortes has produced a number of amazing examples of this.

The first one I came across was his rolling can of coke, click here to check it out. Scroll in the box to see the full effect.

[roboshot url=”https://www.romancortes.com/blog/pure-css-coke-can” width=”800″ newpage=”TRUE” link=”TRUE” refresh=”TRUE”]

Browsing from there the creation of Roman’s that had the biggest impact was the 3D Meninas, click here to check it out. Hover over the image and move from side to side to see the effect.

[roboshot url=”https://www.romancortes.com/blog/css-3d-meninas” width=”800″ newpage=”TRUE” link=”TRUE” refresh=”TRUE”]

As a lover of code, I have such admiration for this use of CSS in a creative way. Roman on his blog has also created fun effects using tiny pieces of javascript code.

Can you find more examples? Post them in the comments section below!

Filed Under: Info + Tips

“Coppertops Digital Marketing can get your business found online, working online and selling online, so what are you waiting for?”
GET IN TOUCH

Contact Us

Call us on 087 6794725
Send us an email
Read our Blog

Social Media

Like us on Facebook
Follow us on Twitter
Check us out on Instagram
Connect with us on LinkedIn
  • Terms & Conditions
  • Cookie Policy
  • Company Details
  • Mission Statement

2013-2019 Coppertops Digital Marketing DAC · All rights reserved

This site uses cookies More info