Version: 1.1.alpha.0
Source on Github

Compass CSS3

The CSS3 module provides cross-browser mixins for CSS properties introduced in CSS3, for example border-radius and text-shadow.

What rendering engines you support for the experimental css properties is governed by the configurable variables defined in the browser support module.

This file can be imported using: @import "compass/css3"


  1. Animation – Specify the CSS3 animation property and all its sub-properties.
  2. Appearance – Specify the CSS3 appearance property.
  3. Background Clip – Specify the background clip for all browsers.
  4. Background Origin – Specify the background origin for all browsers.
  5. Background Size – Specify the background size for all browsers.
  6. Border Radius – Specify the border radius for all browsers.
  7. Box Shadow – Specify the box shadow for all browsers.
  8. Box Sizing – Specify the box sizing for all browsers.
  9. Columns – Specify a columnar layout for all browsers.
  10. Filter – Specify the (image) filter for all browsers.
  11. Flexbox – This module provides mixins that pertain to CSS3 Flexbox.
  12. Font Face – Specify a downloadable font face for all browsers.
  13. Hyphenation – Mixin for breaking space and injecting hypens into overflowing text
  14. Images – Specify linear gradients and radial gradients for many browsers.
  15. Inline Block – Declare an element inline block for all browsers.
  16. Opacity – Specify the opacity for all browsers.
  17. CSS Regions – Specify CSS Regions for supported browsers.
  18. Text Shadow – Specify the text shadow for all browsers.
  19. Transform – Specify transformations for many browsers.
  20. Transition – Specify a style transition for all browsers.
  21. User Interface – Declare an element inline block for all browsers.