prefixed.less

A collection of LESS mixins targeting all prefixed CSS properties that are either a W3C editor's draft, working draft or candidate release.

Big credit to Peter Beverloo for providing the data behind the Vendor-prefixed CSS Property Overview. prefixed.less updates automatically when properties are added to this overview.

Animation

.animation(@animation) {
-webkit-animation: @animation;
   -moz-animation: @animation;
        animation: @animation;
}

Animation delay

.animation-delay(@animation-delay) {
-webkit-animation-delay: @animation-delay;
   -moz-animation-delay: @animation-delay;
        animation-delay: @animation-delay;
}

Animation direction

.animation-direction(@animation-direction) {
-webkit-animation-direction: @animation-direction;
   -moz-animation-direction: @animation-direction;
        animation-direction: @animation-direction;
}

Animation duration

.animation-duration(@animation-duration) {
-webkit-animation-duration: @animation-duration;
   -moz-animation-duration: @animation-duration;
        animation-duration: @animation-duration;
}

Animation fill mode

.animation-fill-mode(@animation-fill-mode) {
-webkit-animation-fill-mode: @animation-fill-mode;
   -moz-animation-fill-mode: @animation-fill-mode;
        animation-fill-mode: @animation-fill-mode;
}

Animation iteration count

.animation-iteration-count(@animation-iteration-count) {
-webkit-animation-iteration-count: @animation-iteration-count;
   -moz-animation-iteration-count: @animation-iteration-count;
        animation-iteration-count: @animation-iteration-count;
}

Animation name

.animation-name(@animation-name) {
-webkit-animation-name: @animation-name;
   -moz-animation-name: @animation-name;
        animation-name: @animation-name;
}

Animation play state

.animation-play-state(@animation-play-state) {
-webkit-animation-play-state: @animation-play-state;
   -moz-animation-play-state: @animation-play-state;
        animation-play-state: @animation-play-state;
}

Animation timing function

.animation-timing-function(@animation-timing-function) {
-webkit-animation-timing-function: @animation-timing-function;
   -moz-animation-timing-function: @animation-timing-function;
        animation-timing-function: @animation-timing-function;
}

Appearance

.appearance(@appearance) {
-webkit-appearance: @appearance;
   -moz-appearance: @appearance;
        appearance: @appearance;
}

Backface visibility

.backface-visibility(@backface-visibility) {
-webkit-backface-visibility: @backface-visibility;
   -moz-backface-visibility: @backface-visibility;
        backface-visibility: @backface-visibility;
}

Background clip

.background-clip(@background-clip) {
-webkit-background-clip: @background-clip;
        background-clip: @background-clip;
}

Background origin

.background-origin(@background-origin) {
-webkit-background-origin: @background-origin;
        background-origin: @background-origin;
}

Background size

.background-size(@background-size) {
-webkit-background-size: @background-size;
        background-size: @background-size;
}

Border after

.border-after(@border-after) {
-webkit-border-after: @border-after;
        border-after: @border-after;
}

Border after color

.border-after-color(@border-after-color) {
-webkit-border-after-color: @border-after-color;
        border-after-color: @border-after-color;
}

Border after style

.border-after-style(@border-after-style) {
-webkit-border-after-style: @border-after-style;
        border-after-style: @border-after-style;
}

Border after width

.border-after-width(@border-after-width) {
-webkit-border-after-width: @border-after-width;
        border-after-width: @border-after-width;
}

Border before

.border-before(@border-before) {
-webkit-border-before: @border-before;
        border-before: @border-before;
}

Border before color

.border-before-color(@border-before-color) {
-webkit-border-before-color: @border-before-color;
        border-before-color: @border-before-color;
}

Border before style

.border-before-style(@border-before-style) {
-webkit-border-before-style: @border-before-style;
        border-before-style: @border-before-style;
}

Border before width

.border-before-width(@border-before-width) {
-webkit-border-before-width: @border-before-width;
        border-before-width: @border-before-width;
}

Border bottom left radius

.border-bottom-left-radius(@border-bottom-left-radius) {
-webkit-border-bottom-left-radius: @border-bottom-left-radius;
        border-bottom-left-radius: @border-bottom-left-radius;
}

Border bottom right radius

.border-bottom-right-radius(@border-bottom-right-radius) {
-webkit-border-bottom-right-radius: @border-bottom-right-radius;
        border-bottom-right-radius: @border-bottom-right-radius;
}

Border end

.border-end(@border-end) {
-webkit-border-end: @border-end;
   -moz-border-end: @border-end;
        border-end: @border-end;
}

Border end color

.border-end-color(@border-end-color) {
-webkit-border-end-color: @border-end-color;
   -moz-border-end-color: @border-end-color;
        border-end-color: @border-end-color;
}

Border end style

.border-end-style(@border-end-style) {
-webkit-border-end-style: @border-end-style;
   -moz-border-end-style: @border-end-style;
        border-end-style: @border-end-style;
}

Border end width

.border-end-width(@border-end-width) {
-webkit-border-end-width: @border-end-width;
   -moz-border-end-width: @border-end-width;
        border-end-width: @border-end-width;
}

Border image

.border-image(@border-image) {
-webkit-border-image: @border-image;
   -moz-border-image: @border-image;
     -o-border-image: @border-image;
        border-image: @border-image;
}

Border radius

.border-radius(@border-radius) {
-webkit-border-radius: @border-radius;
        border-radius: @border-radius;
}

Border start

.border-start(@border-start) {
-webkit-border-start: @border-start;
   -moz-border-start: @border-start;
        border-start: @border-start;
}

Border start color

.border-start-color(@border-start-color) {
-webkit-border-start-color: @border-start-color;
   -moz-border-start-color: @border-start-color;
        border-start-color: @border-start-color;
}

Border start style

.border-start-style(@border-start-style) {
-webkit-border-start-style: @border-start-style;
   -moz-border-start-style: @border-start-style;
        border-start-style: @border-start-style;
}

Border start width

.border-start-width(@border-start-width) {
-webkit-border-start-width: @border-start-width;
   -moz-border-start-width: @border-start-width;
        border-start-width: @border-start-width;
}

Border top left radius

.border-top-left-radius(@border-top-left-radius) {
-webkit-border-top-left-radius: @border-top-left-radius;
        border-top-left-radius: @border-top-left-radius;
}

Border top right radius

.border-top-right-radius(@border-top-right-radius) {
-webkit-border-top-right-radius: @border-top-right-radius;
        border-top-right-radius: @border-top-right-radius;
}

Box align

.box-align(@box-align) {
-webkit-box-align: @box-align;
   -moz-box-align: @box-align;
    -ms-box-align: @box-align;
        box-align: @box-align;
}

Box direction

.box-direction(@box-direction) {
-webkit-box-direction: @box-direction;
   -moz-box-direction: @box-direction;
    -ms-box-direction: @box-direction;
        box-direction: @box-direction;
}

Box flex

.box-flex(@box-flex) {
-webkit-box-flex: @box-flex;
   -moz-box-flex: @box-flex;
    -ms-box-flex: @box-flex;
        box-flex: @box-flex;
}

Box flex group

.box-flex-group(@box-flex-group) {
-webkit-box-flex-group: @box-flex-group;
        box-flex-group: @box-flex-group;
}

Box lines

.box-lines(@box-lines) {
-webkit-box-lines: @box-lines;
    -ms-box-lines: @box-lines;
        box-lines: @box-lines;
}

Box ordinal group

.box-ordinal-group(@box-ordinal-group) {
-webkit-box-ordinal-group: @box-ordinal-group;
   -moz-box-ordinal-group: @box-ordinal-group;
    -ms-box-ordinal-group: @box-ordinal-group;
        box-ordinal-group: @box-ordinal-group;
}

Box orient

.box-orient(@box-orient) {
-webkit-box-orient: @box-orient;
   -moz-box-orient: @box-orient;
    -ms-box-orient: @box-orient;
        box-orient: @box-orient;
}

Box pack

.box-pack(@box-pack) {
-webkit-box-pack: @box-pack;
   -moz-box-pack: @box-pack;
    -ms-box-pack: @box-pack;
        box-pack: @box-pack;
}

Box shadow

.box-shadow(@box-shadow) {
-webkit-box-shadow: @box-shadow;
        box-shadow: @box-shadow;
}

Box sizing

.box-sizing(@box-sizing) {
-webkit-box-sizing: @box-sizing;
   -moz-box-sizing: @box-sizing;
        box-sizing: @box-sizing;
}

Column count

.column-count(@column-count) {
-webkit-column-count: @column-count;
   -moz-column-count: @column-count;
        column-count: @column-count;
}

Column gap

.column-gap(@column-gap) {
-webkit-column-gap: @column-gap;
   -moz-column-gap: @column-gap;
        column-gap: @column-gap;
}

Column rule

.column-rule(@column-rule) {
-webkit-column-rule: @column-rule;
   -moz-column-rule: @column-rule;
        column-rule: @column-rule;
}

Column rule color

.column-rule-color(@column-rule-color) {
-webkit-column-rule-color: @column-rule-color;
   -moz-column-rule-color: @column-rule-color;
        column-rule-color: @column-rule-color;
}

Column rule style

.column-rule-style(@column-rule-style) {
-webkit-column-rule-style: @column-rule-style;
   -moz-column-rule-style: @column-rule-style;
        column-rule-style: @column-rule-style;
}

Column rule width

.column-rule-width(@column-rule-width) {
-webkit-column-rule-width: @column-rule-width;
   -moz-column-rule-width: @column-rule-width;
        column-rule-width: @column-rule-width;
}

Column span

.column-span(@column-span) {
-webkit-column-span: @column-span;
        column-span: @column-span;
}

Column width

.column-width(@column-width) {
-webkit-column-width: @column-width;
   -moz-column-width: @column-width;
        column-width: @column-width;
}

Columns

.columns(@columns) {
-webkit-columns: @columns;
   -moz-columns: @columns;
        columns: @columns;
}

Grid column

.grid-column(@grid-column) {
-ms-grid-column: @grid-column;
    grid-column: @grid-column;
}

Grid column align

.grid-column-align(@grid-column-align) {
-ms-grid-column-align: @grid-column-align;
    grid-column-align: @grid-column-align;
}

Grid column span

.grid-column-span(@grid-column-span) {
-ms-grid-column-span: @grid-column-span;
    grid-column-span: @grid-column-span;
}

Grid columns

.grid-columns(@grid-columns) {
-ms-grid-columns: @grid-columns;
    grid-columns: @grid-columns;
}

Grid layer

.grid-layer(@grid-layer) {
-ms-grid-layer: @grid-layer;
    grid-layer: @grid-layer;
}

Grid row

.grid-row(@grid-row) {
-ms-grid-row: @grid-row;
    grid-row: @grid-row;
}

Grid row align

.grid-row-align(@grid-row-align) {
-ms-grid-row-align: @grid-row-align;
    grid-row-align: @grid-row-align;
}

Grid row span

.grid-row-span(@grid-row-span) {
-ms-grid-row-span: @grid-row-span;
    grid-row-span: @grid-row-span;
}

Grid rows

.grid-rows(@grid-rows) {
-ms-grid-rows: @grid-rows;
    grid-rows: @grid-rows;
}

Hyphenate character

.hyphenate-character(@hyphenate-character) {
-webkit-hyphenate-character: @hyphenate-character;
        hyphenate-character: @hyphenate-character;
}

Hyphens

.hyphens(@hyphens) {
-epub-hyphens: @hyphens;
 -moz-hyphens: @hyphens;
      hyphens: @hyphens;
}

Logical height

.logical-height(@logical-height) {
-webkit-logical-height: @logical-height;
        logical-height: @logical-height;
}

Logical width

.logical-width(@logical-width) {
-webkit-logical-width: @logical-width;
        logical-width: @logical-width;
}

Margin after

.margin-after(@margin-after) {
-webkit-margin-after: @margin-after;
        margin-after: @margin-after;
}

Margin before

.margin-before(@margin-before) {
-webkit-margin-before: @margin-before;
        margin-before: @margin-before;
}

Margin end

.margin-end(@margin-end) {
-webkit-margin-end: @margin-end;
   -moz-margin-end: @margin-end;
        margin-end: @margin-end;
}

Margin start

.margin-start(@margin-start) {
-webkit-margin-start: @margin-start;
   -moz-margin-start: @margin-start;
        margin-start: @margin-start;
}

Marquee direction

.marquee-direction(@marquee-direction) {
-webkit-marquee-direction: @marquee-direction;
        marquee-direction: @marquee-direction;
}

Marquee loop

.marquee-loop(@marquee-loop) {
-wap-marquee-loop: @marquee-loop;
     marquee-loop: @marquee-loop;
}

Marquee speed

.marquee-speed(@marquee-speed) {
-webkit-marquee-speed: @marquee-speed;
   -wap-marquee-speed: @marquee-speed;
        marquee-speed: @marquee-speed;
}

Marquee style

.marquee-style(@marquee-style) {
-webkit-marquee-style: @marquee-style;
   -wap-marquee-style: @marquee-style;
        marquee-style: @marquee-style;
}

Max logical width

.max-logical-width(@max-logical-width) {
-webkit-max-logical-width: @max-logical-width;
        max-logical-width: @max-logical-width;
}

Min logical height

.min-logical-height(@min-logical-height) {
-webkit-min-logical-height: @min-logical-height;
        min-logical-height: @min-logical-height;
}

Min logical width

.min-logical-width(@min-logical-width) {
-webkit-min-logical-width: @min-logical-width;
        min-logical-width: @min-logical-width;
}

Object fit

.object-fit(@object-fit) {
-o-object-fit: @object-fit;
   object-fit: @object-fit;
}

Object position

.object-position(@object-position) {
-o-object-position: @object-position;
   object-position: @object-position;
}

Opacity

.opacity(@opacity) {
-webkit-opacity: @opacity;
        opacity: @opacity;
}

Overflow x

.overflow-x(@overflow-x) {
-ms-overflow-x: @overflow-x;
    overflow-x: @overflow-x;
}

Overflow y

.overflow-y(@overflow-y) {
-ms-overflow-y: @overflow-y;
    overflow-y: @overflow-y;
}

Padding after

.padding-after(@padding-after) {
-webkit-padding-after: @padding-after;
        padding-after: @padding-after;
}

Padding before

.padding-before(@padding-before) {
-webkit-padding-before: @padding-before;
        padding-before: @padding-before;
}

Padding end

.padding-end(@padding-end) {
-webkit-padding-end: @padding-end;
   -moz-padding-end: @padding-end;
        padding-end: @padding-end;
}

Padding start

.padding-start(@padding-start) {
-webkit-padding-start: @padding-start;
   -moz-padding-start: @padding-start;
        padding-start: @padding-start;
}

Perspective

.perspective(@perspective) {
-webkit-perspective: @perspective;
   -moz-perspective: @perspective;
        perspective: @perspective;
}

Perspective origin

.perspective-origin(@perspective-origin) {
-webkit-perspective-origin: @perspective-origin;
   -moz-perspective-origin: @perspective-origin;
        perspective-origin: @perspective-origin;
}

Text align last

.text-align-last(@text-align-last) {
-ms-text-align-last: @text-align-last;
    text-align-last: @text-align-last;
}

Text autospace

.text-autospace(@text-autospace) {
-ms-text-autospace: @text-autospace;
    text-autospace: @text-autospace;
}

Text justify

.text-justify(@text-justify) {
-ms-text-justify: @text-justify;
    text-justify: @text-justify;
}

Text overflow

.text-overflow(@text-overflow) {
-ms-text-overflow: @text-overflow;
    text-overflow: @text-overflow;
}

Transform

.transform(@transform) {
-webkit-transform: @transform;
   -moz-transform: @transform;
    -ms-transform: @transform;
     -o-transform: @transform;
        transform: @transform;
}

Transform origin

.transform-origin(@transform-origin) {
-webkit-transform-origin: @transform-origin;
   -moz-transform-origin: @transform-origin;
    -ms-transform-origin: @transform-origin;
     -o-transform-origin: @transform-origin;
        transform-origin: @transform-origin;
}

Transform style

.transform-style(@transform-style) {
-webkit-transform-style: @transform-style;
   -moz-transform-style: @transform-style;
        transform-style: @transform-style;
}

Transition

.transition(@transition) {
-webkit-transition: @transition;
   -moz-transition: @transition;
     -o-transition: @transition;
        transition: @transition;
}

Transition delay

.transition-delay(@transition-delay) {
-webkit-transition-delay: @transition-delay;
   -moz-transition-delay: @transition-delay;
     -o-transition-delay: @transition-delay;
        transition-delay: @transition-delay;
}

Transition duration

.transition-duration(@transition-duration) {
-webkit-transition-duration: @transition-duration;
   -moz-transition-duration: @transition-duration;
     -o-transition-duration: @transition-duration;
        transition-duration: @transition-duration;
}

Transition property

.transition-property(@transition-property) {
-webkit-transition-property: @transition-property;
   -moz-transition-property: @transition-property;
     -o-transition-property: @transition-property;
        transition-property: @transition-property;
}

Transition timing function

.transition-timing-function(@transition-timing-function) {
-webkit-transition-timing-function: @transition-timing-function;
   -moz-transition-timing-function: @transition-timing-function;
     -o-transition-timing-function: @transition-timing-function;
        transition-timing-function: @transition-timing-function;
}

Word break

.word-break(@word-break) {
-epub-word-break: @word-break;
  -ms-word-break: @word-break;
      word-break: @word-break;
}

Word wrap

.word-wrap(@word-wrap) {
-ms-word-wrap: @word-wrap;
    word-wrap: @word-wrap;
}

Writing mode

.writing-mode(@writing-mode) {
-epub-writing-mode: @writing-mode;
  -ms-writing-mode: @writing-mode;
      writing-mode: @writing-mode;
}