Almost every browser comes with its own CSS prefix like -webkit-, -moz- or -o- which usually ends up in several repeated and unused CSS rules.

PrefixFree is a script which enables us to use CSS properties without vendor-specific prefixes.

At the backend, it detects the browser of users and adds only the prefixes needed to the CSS rules.

It works for both external (<link>) and inline (<style>) styles. PrefixFree even finds elements with style attribute and processes them too.

The script is standalone but there is also an optional jQuery plugin provided.

Animations like fade in/fade out or bounce are used almost everywhere, thanks to the ease that JS frameworks are offering, to create attractive user experiences.

Many of these animations actually have equivalents in CSS and Animate.css eases the usage of them.

It is a single CSS file that includes various rules for animations like flash, bounce, shake and multiple fades, rotates + bounces.

Each animation comes as a class. As CSS animations have native hardware acceleration, they work much smoother compared to JS animations. However, it'll be a good practice to have JS animations as a fallback.

Frameless is a fresh project that shares ideas on grids that adapt column-by-column (rather than pixel-by-pixel).

It suggests a practice on fixed-width grids that are created with mobile-first approach which guarantees that designs created will adapt to any screen-size.

There are several files (like LESS, HTML or Photoshop templates) provided aiming to create a starting point for any designers who find the idea useful for their projects.

Fluid Baseline Grid System is a starting point armed with various resources to be a starting point for creating HTML5-CSS3-powered websites.

It is built with typographic standards in mind with combining principals of fluid-column layouts, baseline grids and mobile-first responsive design into a resolution independent and device agnostic framework.

The kit is packed with CSS normalization (while correcting bugs, fixing common browser inconsistencies and improving usability) and includes jQuery, HTML5 Shiv + Respond.js.

It enforces a lightweight, and non-obtrusive code which can be edited easily for every project. By default, it is based on a 3-column folding layout, 1 column for mobile devices, 2 columns for tablets and 3 columns for desktops and beyond.

Touchy Boilerplate is a starting kit for creating mobile web apps that covers most of the tricky parts of the development process.

It includes an HTML template with all the mobile-related meta tags, various browsing scenarios like animated navigation, fixed header + scrollable content and deep linking support.

Also, there are Geolocation functions and various other UI elements provided.

The boilerplate uses jQuery or Zepto.js and has 2 other optional helpers: Touchy JS and Touchy PHP which handles most of the exciting stuff mentioned above.

One of the exciting features in CSS3: "transitions" come with a transition-timing-function which lets us to define an acceleration curve, so that the speed of the transition can vary over its duration. This is simply how we accomplish easing animations with pure CSS.

If we want to use custom easing animations rather than the pre-defined ones like ease, linear, ease-in, ease-out or ease-in-out the cubic-bezier property, which enables us to define a cubic bezier curve to use as the easing function, reaches to our help.

However, setting the cubic-bezier values can be challenging and a visual representation of the curve makes things much easier. Here are 3 great tools that help creating custom easing values:

Cubic-Bezier.com

The application works with drag 'n' drops and/or keyboard shortcuts.

By updating the curve, it auto-generates the cubic-bezier values. And, you can save them for future use by attaching friendly names and even share each with a unique link.

CSS cubic-bezier Builder

A similar tool which enables creating the values for the curve with drag 'n' drops and also compare the custom one with the pre-defined values.

Ceaser

Ceaser comes with values/transitions of Penner Equations (with approximate values) which means there are many new built-in transitions besides the default ones.

Also, you can create new ones easily and test them on different transition values like width, height or opacity.

Other Tools

There are also few other tools for creating visually creating CSS cubic-bezier values:

• Bezier control
  
• Cubic-bezier tool by Netzgesta.de
  

CSSload is a free and web-based application that can generate loading spinners/bars with pure CSS.

The application offers several (currently 6) loader types and they can be customized in means of color, size and animation speed.

It uses the animation, transitions and transforms capabilities of CSS3 and compatible with browsers supporting them.

BluCSS is a simplistic CSS framework which focuses on creating responsive layouts and has 4 built-in stages for these layouts: desktop, laptop, tablet, and mobile.

By default, it comes with a 1000px main container (which can be updated to any size) and has a 10 column grid (with each having a width specified in percentages for auto-resizing).

The framework also has a solution for responsive images which works by applying _blu class to any images.

And, BluCSS includes basic styling for typography + tables.

The number of iPad-specific magazines/content is increasing with a huge speed these days and you may be involved in such a project too.

If so, Magazine Grid will help a lot as it is a modern CSS framework, built specifically for iPad, which comes with common magazine design elements like pagination, gutters and a basic grid.

The framework uses HTML5 elements for structuring the magazine pages. Simply, an <article> element wraps up your page and <section>s define the portions of content.

Magazine Grid weights only 4kb and has a fallback style for devices with smaller screens.

Mobile HTML5 is a project that displays a comparison chart displaying the HTML5 features support in popular mobile and tablet browsers.

The presentation is very slick easing finding out if that feature should be used on a mobile web app or not.

Currently, the browsers included are Safari on iOS, Android, Blackberry, IE, Opera, Firefox, webOS and Symbian (by mentioning on which device they were tested).

Also, it is possible to see which versions of the browsers support each feature.