admin-lte

<!DOCTYPE html> <html> <head> <title>Ionicons v2.0.0 Cheatsheet</title> <style> * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } body { background: #fff; color: #444; font: 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif; } a, a:visited { color: #888; text-decoration: underline; } a:hover, a:focus { color: #000; } header { border-bottom: 2px solid #ddd; margin-bottom: 20px; overflow: hidden; padding: 20px 0; } header h1 { color: #888; float: left; font-size: 36px; font-weight: 300; } header a { float: right; font-size: 14px; } .container { margin: 0 auto; max-width: 1200px; min-width: 960px; padding: 0 20px; width: 95%; } .icon-row { border-bottom: 1px dotted #ccc; padding: 10px 0 20px; margin-bottom: 20px; } .ion { -webkit-touch-callout: text; -webkit-user-select: text; -khtml-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .preview-icon { vertical-align: bottom; } .preview-scale { color: #888; font-size: 12px; margin-top: 5px; } .step { display: inline-block; line-height: 1; position: relative; width: 10%; } .step i { -webkit-transition: opacity .3s; -moz-transition: opacity .3s; -ms-transition: opacity .3s; -o-transition: opacity .3s; transition: opacity .3s; } .step:hover i { opacity: .3; } .size-12 { font-size: 12px; } .size-14 { font-size: 14px; } .size-16 { font-size: 16px; } .size-18 { font-size: 18px; } .size-21 { font-size: 21px; } .size-24 { font-size: 24px; } .size-32 { font-size: 32px; } .size-48 { font-size: 48px; } .size-64 { font-size: 64px; } .size-96 { font-size: 96px; } .usage { margin-top: 10px; } .usage input { font-family: monospace; margin-right: 3px; padding: 2px 5px; text-align: center; -webkit-touch-callout: text; -webkit-user-select: text; -khtml-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .usage label { font-size: 12px; text-align: right; padding: 0 3px 0 60px; } .usage label:first-child { padding-left: 0; } .usage .name { width: 180px; } .usage .html { width: 80px; } .usage .css { width: 80px; } footer { color: #888; font-size: 12px; padding: 20px 0; } </style> <link href="css/ionicons.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="container"> <header> <h1>Ionicons v2.0.0 Cheatsheet, 733 icons:</h1> <a href="http://ionicons.com/">Ionicons Homepage</a> </header> <div class="content"> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-alert" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf101;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f101" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-alert-circled" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf100;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f100" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-add" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf2c7;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f2c7" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-add-circle" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf359;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f359" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-alarm-clock" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf35a;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f35a" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-alert" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf35b;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f35b" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-apps" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf35c;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f35c" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-archive" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf2c9;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f2c9" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-back" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf2ca;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f2ca" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-down" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf35d;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f35d" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropdown" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf35f;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f35f" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropdown-circle" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf35e;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f35e" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropleft" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf361;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f361" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropleft-circle" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf360;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f360" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropright" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf363;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f363" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropright-circle" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf362;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f362" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropup" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf365;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f365" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-dropup-circle" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf364;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f364" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-forward" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf30f;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f30f" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-arrow-up" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf366;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f366" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-attach" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf367;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f367" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-bar" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf368;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f368" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-bicycle" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf369;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f369" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-boat" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf36a;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f36a" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-bookmark" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf36b;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f36b" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> </div> <div class="preview-scale">12141618212432486496</div> <div class="usage"> <label>Classname:</label> <input class="name" type="text" readonly="readonly" onClick="this.select();" value="ion-android-bulb" /> <label>Selectable:</label>  <label>Escaped HTML:</label> <input class="html" type="text" readonly="readonly" onClick="this.select();" value="&#xf36c;" /> <label>CSS Content:</label> <input class="css" type="text" readonly="readonly" onClick="this.select();" value="\f36c" /> </div> </div> <div class="icon-row"> <div class="preview-icon"> <span class="ste