
CSS is one of the first languages that budding web designers learn. This is probably because the tangible results are easier and quicker to achieve than other languages. However, CSS can be used for so much more than changing a few background colors or positioning elements on the page. Modern day CSS has been used for some amazing creations that we never would have believed possible only a few years ago.

Recently, CSS has been used to create some astounding products in art and animation. These creations range from [a realistic painting made entirely out of CSS](https://github.com/cyanharlow/purecss-francine) to 3D animated shapes and objects, like [an X-Wing from Star Wars](https://codepen.io/juliangarnier/pen/hzDAF). With newer features and properties we can transform from using CSS as a design language to a developer language.

The next logical step is to build games with pure CSS. What once required JavaScript now can be done in with CSS, although it tends to take a lot of lines of CSS instead of a few JavaScript functions. Most games have been reminiscent of the games we have from the early 2000s like digital [tic tac toe](https://codepen.io/una/pen/aNZEbB) or even [Mario Kart](https://codesandbox.io/s/zk15o120xl).

Perhaps one of the biggest pure CSS creations is a search engine. Search engines are one of the most complex features on the internet with thousands of lines of JavaScript plus databases and other components. However, [Algolia was able to create a primitive search engine](https://community.algolia.com/algoliasearch-client-css/demo/) with pure CSS. Although you can’t expect it to search the web, it does a nice job of sorting through the predetermined results and filtering categories.

Again, it would be very simple to code with a few lines of JavaScript but it is really neat to see what can be accomplished with CSS. Each year we are breaking the limits of what we thought was possible with CSS. As new properties are added and people come up with creative utilizations of old and new features we are able to push the limits of what is possible.

Even using CSS in JavaScript frameworks like React or Angular is helping to progress the language. The biggest inhibitor is legacy browsers that are not supporting certain properties. However, we’ve seen a growing need to unify the web and companies are starting to remove support for legacy browsers in favor of modern ones.

With new properties like CSS Grid and additional pseudo classes the future of CSS is looking very bright!


CSS is one of the first languages that budding web designers learn. This is probably because the tangible results are easier and quicker to achieve than other languages. However, CSS can be used for so much more than changing a few background colors or positioning elements on the page. Modern day CSS has been used for some amazing creations that we never would have believed possible only a few years ago.

Recently, CSS has been used to create some astounding products in art and animation. These creations range from <a href="https://github.com/cyanharlow/purecss-francine">a realistic painting made entirely out of CSS</a> to 3D animated shapes and objects, like <a href="https://codepen.io/juliangarnier/pen/hzDAF">an X-Wing from Star Wars</a>. With newer features and properties we can transform from using CSS as a design language to a developer language.

The next logical step is to build games with pure CSS. What once required JavaScript now can be done in with CSS, although it tends to take a lot of lines of CSS instead of a few JavaScript functions. Most games have been reminiscent of the games we have from the early 2000s like digital <a href="https://codepen.io/una/pen/aNZEbB">tic tac toe</a> or even <a href="https://codesandbox.io/s/zk15o120xl">Mario Kart</a>.

Perhaps one of the biggest pure CSS creations is a search engine. Search engines are one of the most complex features on the internet with thousands of lines of JavaScript plus databases and other components. However, <a href="https://community.algolia.com/algoliasearch-client-css/demo/">Algolia was able to create a primitive search engine</a> with pure CSS. Although you can’t expect it to search the web, it does a nice job of sorting through the predetermined results and filtering categories.

Again, it would be very simple to code with a few lines of JavaScript but it is really neat to see what can be accomplished with CSS. Each year we are breaking the limits of what we thought was possible with CSS. As new properties are added and people come up with creative utilizations of old and new features we are able to push the limits of what is possible.

Even using CSS in JavaScript frameworks like React or Angular is helping to progress the language. The biggest inhibitor is legacy browsers that are not supporting certain properties. However, we’ve seen a growing need to unify the web and companies are starting to remove support for legacy browsers in favor of modern ones.

With new properties like CSS Grid and additional pseudo classes the future of CSS is looking very bright!

Assets

Square

Amazing Pure CSS Creations

View post on our website

Tall

Amazing Pure CSS Creations

View post on our website

Wide

Amazing Pure CSS Creations

View post on our website

Other

Amazing Pure CSS Creations