369 pure-css UI Design Examples

AMP Stories 2019

Pure CSS Code Snippets

In this section, you will find pure CSS examples or HTML elements designed in only CSS to give it some sassy effects. Traditionally one might sue JS and other things to achieve similar effects but there are purely CSS only.

From accordion, slider to dropdown navigation menus you can find a lot of CSS only code snippets in here. With the code snippets from this section, you can recreate these effect on your website with no coding experience.

Part of:	buttons, Search, …
What it does:	create awesome designs and animations without Javascript

HTML, CSS Code Snippets for pure css

Pure CSS Vertical Timeline

This pure CSS timeline was designed by Atticus Koya and can be used in your next web design project.

pure css timeline

Pure CSS Tooltips in All Directions

Here is another tooltip design for you, this one is in pure CSS and there are multiple positions you can choose for this one. It was designed by Jase

hidden content pure css tooltip

3D Drop Shadow Text Reveal Animation

A fancy text reveal animation effect in CSS designed by Luke Meyrick. When the page loads the text is revealed with a long drop shadow effect giving it a...

3d animation pure css shadow text animation

Grayscale Emoji using CSS

If for whatever reason you wanted to use less colourful emojis you can use this pure CSS snippet to convert the emojis to greyscale version.

pure css

Glitchy Button Radar Sweep Line Effect

This is a button effect that shows a radar sweep line on button hover. This glitchy button effect was seen on vibeasy.com (warning: with auto-play sound when you open...