Category: CSS

Best CSS gradient, shadow, radius, transition and transform WYSIWYG editor I’ve seen to date. You can create instances for :hover, :active, custom class states. You can also work with transitions and transforms.

Hakim strikes again.

I think this could work.

Picked by Jake Bresnehan.

The easiest way to create and share beautiful presentations.

It’s Hakim‘s project so you know it will be good.

Modal dialogs built out of pure CSS. You know, if you can’t avoid it ;-)

Nice demo of what different properties of CSS background do.

Rodney Rehm for Smashing Magazine:

This article is packed with a number of quirks and issues you should be aware of when working with CSS3 transitions. Please note that I’m not showing any workarounds or giving advice on how to circumvent the issues discussed. Alex MacCaw has already written a very insightful and thorough article on “All You Need to Know About CSS Transitions.”

Super-smooth CSS transitions & transformations for jQuery.

You may also like Animate.css.

Transit link via Aleš Skotnica

Piotr Walczyszyn created nice tool in Responsive Inspector (Chrome Web Store link).

jQuery, 5KB.

I think CSSmatic is the best gradient and noise generation tool right now.

Flat UI - Logo
Free Web User Interface Kit.

Think of it as a WordPress template but for your next web application.

Blueprints by Codrops starting with full width image slider and elastic content slider.

ThreeSixty and Threesixty-slider.

fast and lightweight (3KB) javascript utility that detects browser and pixel ratio, allowing you to serve conditional JavaScript and CSS files. Rebuilt from it’s jQuery predecessor, it’s now 50% faster.

Nice overview by Harry Roberts.

Via @sixrevisions

JavaScript tooltip framework.

Check browser support for CSS, HTML, JS and SVG with this site.

Two tutorials by Codrops: Understanding the CSS Clip Property and Putting CSS Clip to Work.

Another example of what I call primary research in HTML5, CSS & JavaScript:

FFF is a collection of interactive experiences. Each experience has its own unique design and functionality. All the experiences are created in HTML5, the site works beatifully on both desktop and tablet.