Category Archives

CSS

Where HTML elements give a web page structure, CSS (Cascading Style Sheets) controls how those HTML elements are presented on that web page. A style sheet can be applied to any web page and makes it much easier to edit and manage the appearance and layout of a multi-page website.

Here you will find collections of articles, tutorials, snippets, covering almost all areas of CSS, including flexbox, grid, animation, image filters, responsive toolkits, frameworks, libraries, and so much more.

10 CodePen Snippets Especially for Science Geeks

10 CodePen Snippets Especially for Science Geeks

CSS

Science, technology and design are all natural companions. So it makes perfect sense that many of us in the design field are fascinated by tech and the science that makes…

On the Downlow(res): A Showcase of CSS Pixel Art

On the Downlow(res): A Showcase of CSS Pixel Art

With display technology currently in a sort of golden age, you may be curious as to why so many of us are still hung up on pixel art. Why, with…

Keeping Time: A Collection of Clock and Timer Code Snippets

Keeping Time: A Collection of Clock and Timer Code Snippets

The act of displaying time is quite popular on the web. But it’s not at all limited to what we typically wear on our wrist or hang on the wall….

Fun Examples of CSS Imitating Print Design

Fun Examples of CSS Imitating Print Design

There’s still some value in having a document or other printed product that you can hold in your hand. And as much as the web has promised a “paperless” world,…

Bringing the Curtain Effect to Your Website with These Snippets

Bringing the Curtain Effect to Your Website with These Snippets

The curtain effect will not make your design pop or amaze users, but certainly can engage visitors, smarten the design, and enrich the user experience.

10 Beautiful Examples of Particle Animation in Web Design

10 Beautiful Examples of Particle Animation in Web Design

Taking the Web by storm, particle animations managed to carve out quite a niche for themselves several years ago. The massive current obsession with designs that have a high-tech vibe…

20 Beautifully Designed Free Web Fonts

20 Beautifully Designed Free Web Fonts

We have been seeing a great increase in flexibility among web designers. The community has opened up to new standards and allowed these methods to infiltrate our way of designing….

40 Plugins, Addons & Components for the Bootstrap Framework

40 Plugins, Addons & Components for the Bootstrap Framework

Get the most out of the Bootstrap framework with these free components and addons. Buttons, breadcrumbs, calendars, menus, and more.

What Is Atomic Web Design and Do I Need It?

What Is Atomic Web Design and Do I Need It?

CSS

Web designers may use a number of techniques, approaches and philosophies while creating compelling and engaging with digital interfaces. Each designer has their own preferences – some prefer to work…

Simple CSS Transition, Transform & Animation Tutorial

Simple CSS Transition, Transform & Animation Tutorial

CSS

This is part 1 of a series of tutorials about practical use cases of CSS transitions, transforms, and animations. In this tutorial, we’ll look at a “flipping card” scenario, and…

How to Create Round, Flat and Flip-Style CSS Toggle Switches

How to Create Round, Flat and Flip-Style CSS Toggle Switches

CSS

In this tutorial, we show how to easily create some fantastic round, flat and flip-style CSS toggle switches. We’ll be using pure CSS to create some toggle switches, adding a…

How to Create Revealing Content Overlays With CSS3 Transitions

How to Create Revealing Content Overlays With CSS3 Transitions

CSS