Topic Archives

CSS Snippets

From animation to responsive design, find the perfect CSS code snippet for your web design project and streamline your development process.

View all CSS content

10 CSS & JavaScript Snippets for Page Transition Effects

10 CSS & JavaScript Snippets for Page Transition Effects

CSS / UI Design

A collection of CSS and JavaScript snippets for creating page transitions that you can use to add something exciting to your next project.

8 CSS & JavaScript Snippets for Social Media Icons & Buttons

8 CSS & JavaScript Snippets for Social Media Icons & Buttons

CSS / JavaScript / UI Design

Customize your website with unique social media icons using CSS and JavaScript. Stand out with personalized icons that match your brand.

8 Pure CSS Games You Can Play in Your Browser

8 Pure CSS Games You Can Play in Your Browser

CSS / UI Design

A collection of the best pure CSS games currently available. They range from the stupefyingly simple all the way to “wow, CSS can do that?”

8 CSS & JavaScript Snippets for Awesome Reveal Effects

8 CSS & JavaScript Snippets for Awesome Reveal Effects

CSS / JavaScript / UI Design

A collection of copy and paste CSS and JavaScript code snippets for creating animated reveal effects.

8 CSS & JavaScript Snippets for Creating 3D Text Effects

8 CSS & JavaScript Snippets for Creating 3D Text Effects

CSS / JavaScript / UI Design

A collection of CSS and JS snippets for creating beautiful 3D text effects. They run the gamut from calm and classy to outrageously animated.

8 CSS & JavaScript Snippets for Wild & Crazy Backgrounds

8 CSS & JavaScript Snippets for Wild & Crazy Backgrounds

CSS / JavaScript / UI Design

We take a look at an area that will grab your attention: wild and crazy background patterns built with CSS and JavaScript. No subtlety here.

How to Target Design Elements with the CSS :not Pseudo-Class

How to Target Design Elements with the CSS :not Pseudo-Class

CSS / UI Design

:not allows you to target elements that do not match a list of provided selectors. The result is more control over niche design features.

8 CSS & JavaScript Snippets for Creating Animated Progress Bars

8 CSS & JavaScript Snippets for Creating Animated Progress Bars

CSS / JavaScript / UI Design

A collection of copy and paste CSS and JavaScript code snippets for creating dynamic progress bars.

8 CSS & JavaScript Snippets for Creating Complex Gradients

8 CSS & JavaScript Snippets for Creating Complex Gradients

CSS / JavaScript / UI Design

Gradients are a true staple of web design. Their beauty lies in their versatility. Use them to make a big, bold statement. Or use them as an accent piece to…

8 CSS Snippets for Creating Bento Grid Layouts

8 CSS Snippets for Creating Bento Grid Layouts

CSS / UI Design / Web Design

Dive into CSS bento grid layouts. A collection of CSS flexbox and grid code snippets, and examples for enhancing your web development skills.

8 CSS & JavaScript Snippets for Reflection & Refraction Effects

8 CSS & JavaScript Snippets for Reflection & Refraction Effects

CSS / JavaScript / UI Design

The simple act of light reflecting off of or refracting through a surface can produce stunning visuals. We see it every day in the physical world. It might be the…

10 CSS Snippets for Creating Loading Spinners

10 CSS Snippets for Creating Loading Spinners

CSS / UI Design

Whether designing an Ajax-powered app or wanting to add a fun preloader to your website, these CSS spinner snippets are just what you need.

10 CSS Code Snippets for Responsive Text Techniques

10 CSS Code Snippets for Responsive Text Techniques

CSS / UI Design

We take a look at a number of different approaches you can take to implement responsive text into your web design layouts.

8 CSS Grid Snippets for Creating Common Website Layouts

8 CSS Grid Snippets for Creating Common Website Layouts

CSS / UI Design

A collection of common website layout concepts built using CSS grid. Each one demonstrates how they can make life easier for web designers.

Create Better CSS Layouts with Flexbox

Create Better CSS Layouts with Flexbox

CSS / UI Design

CSS Flexbox does have a bit of a learning curve, but taking the time to learn the basics is highly recommended. These examples will help you!

8 CSS & JavaScript Snippets for Creating Realistic Liquid Effects

8 CSS & JavaScript Snippets for Creating Realistic Liquid Effects

CSS / JavaScript / UI Design

A collection of liquid effects CSS & JavaScript snippets that are incredibly realistic, while others are reminiscent of a sci-fi fantasy.

8 CSS & JavaScript Snippets for Bokeh Effects

8 CSS & JavaScript Snippets for Bokeh Effects

CSS / JavaScript / UI Design

Enhance your website’s look with these CSS and JavaScript snippets for creating eye-catching bokeh effects. Perfect for adding visual flair.

8 CSS & JavaScript Snippets for Animating Words

8 CSS & JavaScript Snippets for Animating Words

CSS / JavaScript / UI Design
Previous Page1234Next Page