Awesome

CSS Snippets

This extension provide you shorthand CSS snippets for VS Code. It's support CSS/SCSS/LESS currently.

If the extension does not working normally. Please check the Snippet Suggestions value in VS Code setting. inline/top value are recommended, otherwise the snippets will be hidden or at the bottom of the suggestion box.

You can check the list for detail info.

Prefix	CSS Snippet Content
`ai`	`align-items : flex-start;`
`aib`	`align-items : baseline;`
`aic`	`align-items : center;`
`aifs`	`align-items : flex-start;`
`aife`	`align-items : flex-end;`
`ais`	`align-items : stretch;`
`as`	`align-self : flex-start;`
`ani`	`animation : name 1s linear;`
`anide`	`animation-delay : 1s;`
`anidi`	`animation-direction : alternate;`
`anidu`	`animation-duratuion : 1s;`
`anifm`	`animation-fill-mode : forwards;`
`aniic`	`animation-iteration-count: infinite;`
`anin`	`animation-name : name;`
`anips`	`animation-play-state : paused;`
`anitf`	`animation-timing-function: linear;`
`bg`	`background : #fff;`
`bga`	`background-attachment : fixed;`
`bgc`	`background-color : #fff;`
`bgcl`	`background-clip : border-box;`
`bgi`	`background-image : url("background.jpg");`
`bgo`	`background-origin : border-box;`
`bgp`	`background-position : left top;`
`bgr`	`background-repeat : no-repeat;`
`bgrr`	`background-repeat : repeat;`
`bgrx`	`background-repeat : repeat-x;`
`bgry`	`background-repeat : repeat-y;`
`bgrn`	`background-repeat : no-repeat;`
`bgs`	`background-size : cover;`
`bor`	`border : 1px solid #eee;`
`born`	`border : none;`
`borc`	`border-color : #eee;`
`bors`	`border-style : solid;`
`borw`	`border-width : 1px;`
`borb`	`border-bottom : 1px solid #eee;`
`borl`	`border-left : 1px solid #eee;`
`borr`	`border-right : 1px solid #eee;`
`bort`	`border-top : 1px solid #eee;`
`br`	`border-radius : 2px;`
`bot`	`bottom : 0;`
`bos`	`box-shadow : 1px 1px 1px 1px rgba(0, 0, 0, .5);`
`boz`	`box-sizing : border-box;`
`clr`	`clear : both;`
`col`	`color : #333333;`
`con`	`content : '';`
`cur`	`cursor : auto;`
`curp`	`cursor : pointer;`
`curd`	`cursor : default;`
`dis`	`display : none;`
`disb`	`display : block;`
`disi`	`display : inline-block;`
`disn`	`display : none;`
`disf`	`display : flex;`
`disif`	`display : inline-flex;`
`disg`	`display : grid;`
`disig`	`display : inline-grid;`
`flex`	`flex : 1 1 auto;`
`fle`	`flex : 1 1 auto;`
`fld`	`flex-direction : row;`
`fldr`	`flex-direction : row;`
`fldc`	`flex-direction : column;`
`flf`	`flex-flow : row, wrap;`
`flw`	`flex-wrap : wrap;`
`fl`	`float : left;`
`fll`	`float : left;`
`flr`	`float : right;`
`fln`	`float : none;`
`ff`	`font-family : arial;`
`fz`	`font-size : 12px;`
`fst`	`font-style : italic;`
`fsti`	`font-style : italic;`
`fstn`	`font-style : normal;`
`fsto`	`font-style : oblique;`
`fw`	`font-weight : bold;`
`fwb`	`font-weight : bold;`
`fwl`	`font-weight : light;`
`fwn`	`font-weight : normal;`
`ft`	`font : 12px/1.5;`
`ga`	`grid-area : some-grid-area;`
`gc`	`grid-columns : 1;`
`gr`	`grid-rows : 1;`
`gta`	`grid-template-area : some-grid-area;`
`gtc`	`grid-template-columns : 1fr;`
`gtcre`	`grid-template-columns : repeat(auto-fill, minmax(${0:300px}, 1fr));`
`gtr`	`grid-template-rows : 1fr;`
`hei`	`height : 1px;`
`jc`	`justify-content : flex-start;`
`jcfe`	`justify-content : flex-end;`
`jcfs`	`justify-content : flex-start;`
`jcc`	`justify-content : center;`
`jcsa`	`justify-content : space-around;`
`jcsb`	`justify-content : space-between;`
`lis`	`list-style : disc outside;`
`lisp`	`list-style-position : outside;`
`list`	`list-style-type : disc;`
`listc`	`list-style-type : circle;`
`listd`	`list-style-type : disc;`
`listlr`	`list-style-type : lower-roman;`
`listn`	`list-style-type : none;`
`lists`	`list-style-type : square;`
`listur`	`list-style-type : upper-roman;`
`lef`	`left : 0;`
`lh`	`line-height : 1.5;`
`ls`	`letter-spacing : 2px;`
`lsn`	`letter-spacing : normal;`
`mar`	`margin : 0;`
`marb`	`margin-bottom : 0;`
`marl`	`margin-left : 0;`
`marr`	`margin-right : 0;`
`mart`	`margin-top : 0;`
`mara`	`margin : 0 auto;`
`mih`	`min-height : 1px;`
`miw`	`min-width : 1px;`
`mah`	`max-height : 1px;`
`maw`	`max-width : 1px;`
`opa`	`opacity : 0;`
`ov`	`overflow : visible;`
`ova`	`overflow : auto;`
`ovh`	`overflow : hidden;`
`ovs`	`overflow : scroll;`
`ovv`	`overflow : visible;`
`pad`	`padding : 0;`
`padb`	`padding-bottom : 0;`
`padl`	`padding-left : 0;`
`padr`	`padding-right : 0;`
`padt`	`padding-top : 0;`
`pos`	`position : relative;`
`posa`	`position : absolute;`
`posf`	`position : fixed;`
`posr`	`position : relative;`
`poss`	`position : sticky;`
`rig`	`right : 0;`
`ta`	`text-align : center;`
`tac`	`text-align : center;`
`tal`	`text-align : left;`
`tar`	`text-align : right;`
`td`	`text-decoration : none;`
`tdu`	`text-decoration : underline;`
`tdn`	`text-decoration : none;`
`tdl`	`text-decoration : line-through;`
`ti`	`text-indent : 2em;`
`ts`	`text-shadow : 1px 1px 1px 1px rgba(0, 0, 0, .5);`
`tt`	`text-transform : capitalize;`
`top`	`top : 0;`
`va`	`vertical-align : baseline;`
`vab`	`vertical-align : bottom;`
`vam`	`vertical-align : middle;`
`vat`	`vertical-align : top;`
`vis`	`visibility : visible;`
`visv`	`visibility : visible;`
`vish`	`visibility : hidden;`
`wb`	`word-break : break-all;`
`wid`	`width : 0;`
`wida`	`width : auto;`
`ws`	`white-space : nowrap;`
`wsn`	`white-space : nowrap;`
`wsp`	`white-space : pre;`
`ww`	`word-wrap : break-word;`
`zi`	`z-index : -1;`
`imp`	`@import 'filename';`
`inc`	`@include mixin;`
`key`	`@keyframes name {};`
`med`	`@media screen and (max-width: 300px) {}`
`mix`	`@mixin name {}`
`!`	`!important`
`i`	`!important`