Bootstrap 4 - Glyphicons migration

Question

We have a project that uses glyphicons intensively  Bootstrap v4 drops the glyphicon font altogether   Is there an equivalent for icons shipped with Bootstrap V4     http   v4-alpha getbootstrap com migration

User · Answer

Go to   https   github com Darkseal bootstrap4-glyphicons  download and include in your code    lt link href  bootstrap4-glyphicons css bootstrap-glyphicons css  rel  stylesheet  gt

User · Answer

If needing only glyphicon classes in CSS     x000D   x000D   font-face font-family  Glyphicons Halflings  src url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular eot   src url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular eot  iefix   format  embedded-opentype   url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular woff   format  woff   url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular ttf   format  truetype   url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular svg glyphicons-halflingsregular   format  svg     glyphicon position relative top 1px display inline-block font-family  Glyphicons Halflings  font-style normal font-weight normal line-height 1 -webkit-font-smoothing antialiased   x000D   glyphicon-asterisk before content   2a    x000D   glyphicon-plus before content   2b    x000D   glyphicon-euro before content   20ac    x000D   glyphicon-minus before content   2212    x000D   glyphicon-cloud before content   2601    x000D   glyphicon-envelope before content   2709    x000D   glyphicon-pencil before content   270f    x000D   glyphicon-glass before content   e001    x000D   glyphicon-music before content   e002    x000D   glyphicon-search before content   e003    x000D   glyphicon-heart before content   e005    x000D   glyphicon-star before content   e006    x000D   glyphicon-star-empty before content   e007    x000D   glyphicon-user before content   e008    x000D   glyphicon-film before content   e009    x000D   glyphicon-th-large before content   e010    x000D   glyphicon-th before content   e011    x000D   glyphicon-th-list before content   e012    x000D   glyphicon-ok before content   e013    x000D   glyphicon-remove before content   e014    x000D   glyphicon-zoom-in before content   e015    x000D   glyphicon-zoom-out before content   e016    x000D   glyphicon-off before content   e017    x000D   glyphicon-signal before content   e018    x000D   glyphicon-cog before content   e019    x000D   glyphicon-trash before content   e020    x000D   glyphicon-home before content   e021    x000D   glyphicon-file before content   e022    x000D   glyphicon-time before content   e023    x000D   glyphicon-road before content   e024    x000D   glyphicon-download-alt before content   e025    x000D   glyphicon-download before content   e026    x000D   glyphicon-upload before content   e027    x000D   glyphicon-inbox before content   e028    x000D   glyphicon-play-circle before content   e029    x000D   glyphicon-repeat before content   e030    x000D   glyphicon-refresh before content   e031    x000D   glyphicon-list-alt before content   e032    x000D   glyphicon-flag before content   e034    x000D   glyphicon-headphones before content   e035    x000D   glyphicon-volume-off before content   e036    x000D   glyphicon-volume-down before content   e037    x000D   glyphicon-volume-up before content   e038    x000D   glyphicon-qrcode before content   e039    x000D   glyphicon-barcode before content   e040    x000D   glyphicon-tag before content   e041    x000D   glyphicon-tags before content   e042    x000D   glyphicon-book before content   e043    x000D   glyphicon-print before content   e045    x000D   glyphicon-font before content   e047    x000D   glyphicon-bold before content   e048    x000D   glyphicon-italic before content   e049    x000D   glyphicon-text-height before content   e050    x000D   glyphicon-text-width before content   e051    x000D   glyphicon-align-left before content   e052    x000D   glyphicon-align-center before content   e053    x000D   glyphicon-align-right before content   e054    x000D   glyphicon-align-justify before content   e055    x000D   glyphicon-list before content   e056    x000D   glyphicon-indent-left before content   e057    x000D   glyphicon-indent-right before content   e058    x000D   glyphicon-facetime-video before content   e059    x000D   glyphicon-picture before content   e060    x000D   glyphicon-map-marker before content   e062    x000D   glyphicon-adjust before content   e063    x000D   glyphicon-tint before content   e064    x000D   glyphicon-edit before content   e065    x000D   glyphicon-share before content   e066    x000D   glyphicon-check before content   e067    x000D   glyphicon-move before content   e068    x000D   glyphicon-step-backward before content   e069    x000D   glyphicon-fast-backward before content   e070    x000D   glyphicon-backward before content   e071    x000D   glyphicon-play before content   e072    x000D   glyphicon-pause before content   e073    x000D   glyphicon-stop before content   e074    x000D   glyphicon-forward before content   e075    x000D   glyphicon-fast-forward before content   e076    x000D   glyphicon-step-forward before content   e077    x000D   glyphicon-eject before content   e078    x000D   glyphicon-chevron-left before content   e079    x000D   glyphicon-chevron-right before content   e080    x000D   glyphicon-plus-sign before content   e081    x000D   glyphicon-minus-sign before content   e082    x000D   glyphicon-remove-sign before content   e083    x000D   glyphicon-ok-sign before content   e084    x000D   glyphicon-question-sign before content   e085    x000D   glyphicon-info-sign before content   e086    x000D   glyphicon-screenshot before content   e087    x000D   glyphicon-remove-circle before content   e088    x000D   glyphicon-ok-circle before content   e089    x000D   glyphicon-ban-circle before content   e090    x000D   glyphicon-arrow-left before content   e091    x000D   glyphicon-arrow-right before content   e092    x000D   glyphicon-arrow-up before content   e093    x000D   glyphicon-arrow-down before content   e094    x000D   glyphicon-share-alt before content   e095    x000D   glyphicon-resize-full before content   e096    x000D   glyphicon-resize-small before content   e097    x000D   glyphicon-exclamation-sign before content   e101    x000D   glyphicon-gift before content   e102    x000D   glyphicon-leaf before content   e103    x000D   glyphicon-eye-open before content   e105    x000D   glyphicon-eye-close before content   e106    x000D   glyphicon-warning-sign before content   e107    x000D   glyphicon-plane before content   e108    x000D   glyphicon-random before content   e110    x000D   glyphicon-comment before content   e111    x000D   glyphicon-magnet before content   e112    x000D   glyphicon-chevron-up before content   e113    x000D   glyphicon-chevron-down before content   e114    x000D   glyphicon-retweet before content   e115    x000D   glyphicon-shopping-cart before content   e116    x000D   glyphicon-folder-close before content   e117    x000D   glyphicon-folder-open before content   e118    x000D   glyphicon-resize-vertical before content   e119    x000D   glyphicon-resize-horizontal before content   e120    x000D   glyphicon-hdd before content   e121    x000D   glyphicon-bullhorn before content   e122    x000D   glyphicon-certificate before content   e124    x000D   glyphicon-thumbs-up before content   e125    x000D   glyphicon-thumbs-down before content   e126    x000D   glyphicon-hand-right before content   e127    x000D   glyphicon-hand-left before content   e128    x000D   glyphicon-hand-up before content   e129    x000D   glyphicon-hand-down before content   e130    x000D   glyphicon-circle-arrow-right before content   e131    x000D   glyphicon-circle-arrow-left before content   e132    x000D   glyphicon-circle-arrow-up before content   e133    x000D   glyphicon-circle-arrow-down before content   e134    x000D   glyphicon-globe before content   e135    x000D   glyphicon-tasks before content   e137    x000D   glyphicon-filter before content   e138    x000D   glyphicon-fullscreen before content   e140    x000D   glyphicon-dashboard before content   e141    x000D   glyphicon-heart-empty before content   e143    x000D   glyphicon-link before content   e144    x000D   glyphicon-phone before content   e145    x000D   glyphicon-usd before content   e148    x000D   glyphicon-gbp before content   e149    x000D   glyphicon-sort before content   e150    x000D   glyphicon-sort-by-alphabet before content   e151    x000D   glyphicon-sort-by-alphabet-alt before content   e152    x000D   glyphicon-sort-by-order before content   e153    x000D   glyphicon-sort-by-order-alt before content   e154    x000D   glyphicon-sort-by-attributes before content   e155    x000D   glyphicon-sort-by-attributes-alt before content   e156    x000D   glyphicon-unchecked before content   e157    x000D   glyphicon-expand before content   e158    x000D   glyphicon-collapse-down before content   e159    x000D   glyphicon-collapse-up before content   e160    x000D   glyphicon-log-in before content   e161    x000D   glyphicon-flash before content   e162    x000D   glyphicon-log-out before content   e163    x000D   glyphicon-new-window before content   e164    x000D   glyphicon-record before content   e165    x000D   glyphicon-save before content   e166    x000D   glyphicon-open before content   e167    x000D   glyphicon-saved before content   e168    x000D   glyphicon-import before content   e169    x000D   glyphicon-export before content   e170    x000D   glyphicon-send before content   e171    x000D   glyphicon-floppy-disk before content   e172    x000D   glyphicon-floppy-saved before content   e173    x000D   glyphicon-floppy-remove before content   e174    x000D   glyphicon-floppy-save before content   e175    x000D   glyphicon-floppy-open before content   e176    x000D   glyphicon-credit-card before content   e177    x000D   glyphicon-transfer before content   e178    x000D   glyphicon-cutlery before content   e179    x000D   glyphicon-header before content   e180    x000D   glyphicon-compressed before content   e181    x000D   glyphicon-earphone before content   e182    x000D   glyphicon-phone-alt before content   e183    x000D   glyphicon-tower before content   e184    x000D   glyphicon-stats before content   e185    x000D   glyphicon-sd-video before content   e186    x000D   glyphicon-hd-video before content   e187    x000D   glyphicon-subtitles before content   e188    x000D   glyphicon-sound-stereo before content   e189    x000D   glyphicon-sound-dolby before content   e190    x000D   glyphicon-sound-5-1 before content   e191    x000D   glyphicon-sound-6-1 before content   e192    x000D   glyphicon-sound-7-1 before content   e193    x000D   glyphicon-copyright-mark before content   e194    x000D   glyphicon-registration-mark before content   e195    x000D   glyphicon-cloud-download before content   e197    x000D   glyphicon-cloud-upload before content   e198    x000D   glyphicon-tree-conifer before content   e199    x000D   glyphicon-tree-deciduous before content   e200    x000D   glyphicon-briefcase before content   1f4bc    x000D   glyphicon-calendar before content   1f4c5    x000D   glyphicon-pushpin before content   1f4cc    x000D   glyphicon-paperclip before content   1f4ce    x000D   glyphicon-camera before content   1f4f7    x000D   glyphicon-lock before content   1f512    x000D   glyphicon-bell before content   1f514    x000D   glyphicon-bookmark before content   1f516    x000D   glyphicon-fire before content   1f525    x000D   glyphicon-wrench before content   1f527    x000D   x000D   x000D

User · Answer

The glyphicons less file from Bootstrap 3 is available on GitHub  https   github com twbs bootstrap blob master less glyphicons less  It needs these variables    icon-font-path               fonts     icon-font-name            glyphicons-halflings-regular    icon-font-svg-id          glyphicons halflingsregular     Then you can convert the  less file to a  css file which you can use directly  You can do this online on lesscss org less-preview   Here I ve done it for you  save it as glyphicons css and include it in your HTML files    lt link href   Content glyphicons css  rel  stylesheet    gt    You also need the Glyphicon fonts which is in the Bootstrap 3 package  place them in a  fonts  directory   Now you can just keep on using Glyphicons with Bootstrap 4 as usual

User · Answer

You can use both Font Awesome and Github Octicons as a free alternative for Glyphicons   Bootstrap 4 also switched from Less to Sass  so you might integerate the font s Sass  SCSS  into you build process  to create a single CSS file for your projects   Also see https   getbootstrap com docs 4 1 getting-started build-tools  to find out how to set up your tooling    Download and install Node  which we use to manage our dependencies  Navigate to the root  bootstrap directory and run npm install to install our local dependencies listed in package json  Install Ruby  install Bundler with gem install bundler  and finally run bundle install  This will install all Ruby dependencies  such as Jekyll and plugins    Font Awesome   Download the files at https   github com FortAwesome Font-Awesome tree fa-4 Copy the font-awesome scss folder into your  bootstrap folder Open your SCSS  bootstrap bootstrap scss and write down the following SCSS code at the end of this file    fa-font-path      fonts    import     font-awesome scss font-awesome scss   Notice that you also have to copy the font file from font-awesome fonts to dist fonts or any other public folder set by  fa-font-path in the previous step Run  npm run dist to recompile your code with Font-Awesome   Github Octicons        Download the files at https   github com github octicons  Copy the octicons folder into your  bootstrap folder Open your SCSS  bootstrap bootstrap scss and write down the following SCSS code at the end of this file    fa-font-path      fonts    import     octicons octicons octicons scss   Notice that you also have to copy the font file from font-awesome fonts to dist fonts or any other public folder set by  fa-font-path in the previous step Run  npm run dist to recompile your code with Octicons   Glyphicons   On the Bootstrap website you can read      Includes over 250 glyphs in font format from the Glyphicon Halflings set  Glyphicons Halflings are normally not available for free  but their creator has made them available for Bootstrap free of cost  As a thank you  we only ask that you include a link back to Glyphicons whenever possible    As I understand you can use these 250 glyphs free of cost restricted for Bootstrap but not limited to version 3 exclusive  So you can use them for Bootstrap 4 too    Copy the fonts files from  https   github com twbs bootstrap-sass tree master assets fonts bootstrap Copy the https   github com twbs bootstrap-sass blob master assets stylesheets bootstrap  glyphicons scss file into your bootstrap scss folder Open your scss  bootstrap bootstrap scss and write down the following SCSS code at the end of this file       bootstrap-sass-asset-helper  false   icon-font-name   glyphicons-halflings-regular    icon-font-svg-id   glyphicons halflingsregular    icon-font-path      fonts     import  glyphicons      Run  npm run dist to recompile your code with Glyphicons     Notice that Bootstrap 4 requires the post CSS Autoprefixer for compiling  When you are using a static Sass compiler to compile your CSS you should have to run the Autoprefixer afterwards   You can find out more about mixing with the Bootstrap 4 SCSS in here   You can also use Bower to install the fonts above  Using Bower Font Awesome installs your files in bower components components-font-awesome  also notice that Github Octicons sets the octicons octicons octicons- scss as the main file whilst you should use octicons octicons sprockets-octicons scss   All the above will compile all your CSS code including into a single file  which requires only one HTTP request  Alternatively you can also load the Font-Awesome font from CDN  which can be fast too in many situations  Both fonts on CDN also include the font files  using data-uri s  possible not supported for older browsers   So consider which solution best fits your situation depending on among others browsers to support   For Font Awesome paste the following code into the  lt head gt  section of your site s HTML    lt link href  https   stackpath bootstrapcdn com font-awesome 4 7 0 css font-awesome min css  rel  stylesheet  gt    Also try Yeoman generator to scaffold out a front-end Bootstrap 4 Web app to test Bootstrap 4 with Font Awesome or Github Octicons

User · Answer

Overview   I am using bootstrap 4 without glyphicons   I found a problem with bootstrap treeview that depends upon glyphicons   I am using treeview as is  and I am using scss  extend to translate the icon class styles to font awesome class styles   I think this is quite slick  if you ask me    Details   I used scss  extend to handle it for me   I previously decided to use font-awesome for no better reason than I have used it in the past   When I went to try bootstrap treeview  I found that the icons were missing  because I didn t have glyphicons installed   I decided to use the scss  extend feature  to have the glyphicon classes use the font-awesome classes as so    treeview      glyphicon        extend  fa         glyphicon-minus        extend  fa-minus         glyphicon-plus        extend  fa-plus

User · Answer

If you are using Laravel 5 6  it comes with Bootstrap 4  All you need to is   npm install and npm install open-iconic --save   At  resources assets sass app scss change the line of of Google font import on line 2 to   import   open-iconic font css open-iconic-bootstrap     All you need to do now is  npm run watch   and include    lt link rel  stylesheet  href    asset  css app css      gt    on top of master blade file and  lt script src    asset  js app js      gt  lt  script gt  before closing body tag  You will get Bootstrap 4 and icon   Usage is  lt span class  oi oi-cog  gt  lt  span gt    Refer here for icon details  Open Iconic  Recommended by Bootstrap 4  If on other project than Laravel  you can just do import  import  node modules open-iconic font css open-iconic-bootstrap-min css   in your style file    Hope this helps  Happy trying

User · Answer

Bootstrap 4 files do not come with the glyphicon support  But you can simply open up your bootstrap css or bootstrap min css and paste this code which I came across here   font-face font-family  Glyphicons Halflings  src url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular eot   src url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular eot  iefix   format  embedded-opentype   url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular woff   format  woff   url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular ttf   format  truetype   url  https   netdna bootstrapcdn com bootstrap 3 0 0 fonts glyphicons-halflings-regular svg glyphicons-halflingsregular   format  svg     glyphicon position relative top 1px display inline-block font-family  Glyphicons Halflings  font-style normal font-weight normal line-height 1 -webkit-font-smoothing antialiased    glyphicon-asterisk before content  quot  2a quot     glyphicon-plus before content  quot  2b quot     glyphicon-euro before content  quot  20ac quot     glyphicon-minus before content  quot  2212 quot     glyphicon-cloud before content  quot  2601 quot     glyphicon-envelope before content  quot  2709 quot     glyphicon-pencil before content  quot  270f quot     glyphicon-glass before content  quot  e001 quot     glyphicon-music before content  quot  e002 quot     glyphicon-search before content  quot  e003 quot     glyphicon-heart before content  quot  e005 quot     glyphicon-star before content  quot  e006 quot     glyphicon-star-empty before content  quot  e007 quot     glyphicon-user before content  quot  e008 quot     glyphicon-film before content  quot  e009 quot     glyphicon-th-large before content  quot  e010 quot     glyphicon-th before content  quot  e011 quot     glyphicon-th-list before content  quot  e012 quot     glyphicon-ok before content  quot  e013 quot     glyphicon-remove before content  quot  e014 quot     glyphicon-zoom-in before content  quot  e015 quot     glyphicon-zoom-out before content  quot  e016 quot     glyphicon-off before content  quot  e017 quot     glyphicon-signal before content  quot  e018 quot     glyphicon-cog before content  quot  e019 quot     glyphicon-trash before content  quot  e020 quot     glyphicon-home before content  quot  e021 quot     glyphicon-file before content  quot  e022 quot     glyphicon-time before content  quot  e023 quot     glyphicon-road before content  quot  e024 quot     glyphicon-download-alt before content  quot  e025 quot     glyphicon-download before content  quot  e026 quot     glyphicon-upload before content  quot  e027 quot     glyphicon-inbox before content  quot  e028 quot     glyphicon-play-circle before content  quot  e029 quot     glyphicon-repeat before content  quot  e030 quot     glyphicon-refresh before content  quot  e031 quot     glyphicon-list-alt before content  quot  e032 quot     glyphicon-flag before content  quot  e034 quot     glyphicon-headphones before content  quot  e035 quot     glyphicon-volume-off before content  quot  e036 quot     glyphicon-volume-down before content  quot  e037 quot     glyphicon-volume-up before content  quot  e038 quot     glyphicon-qrcode before content  quot  e039 quot     glyphicon-barcode before content  quot  e040 quot     glyphicon-tag before content  quot  e041 quot     glyphicon-tags before content  quot  e042 quot     glyphicon-book before content  quot  e043 quot     glyphicon-print before content  quot  e045 quot     glyphicon-font before content  quot  e047 quot     glyphicon-bold before content  quot  e048 quot     glyphicon-italic before content  quot  e049 quot     glyphicon-text-height before content  quot  e050 quot     glyphicon-text-width before content  quot  e051 quot     glyphicon-align-left before content  quot  e052 quot     glyphicon-align-center before content  quot  e053 quot     glyphicon-align-right before content  quot  e054 quot     glyphicon-align-justify before content  quot  e055 quot     glyphicon-list before content  quot  e056 quot     glyphicon-indent-left before content  quot  e057 quot     glyphicon-indent-right before content  quot  e058 quot     glyphicon-facetime-video before content  quot  e059 quot     glyphicon-picture before content  quot  e060 quot     glyphicon-map-marker before content  quot  e062 quot     glyphicon-adjust before content  quot  e063 quot     glyphicon-tint before content  quot  e064 quot     glyphicon-edit before content  quot  e065 quot     glyphicon-share before content  quot  e066 quot     glyphicon-check before content  quot  e067 quot     glyphicon-move before content  quot  e068 quot     glyphicon-step-backward before content  quot  e069 quot     glyphicon-fast-backward before content  quot  e070 quot     glyphicon-backward before content  quot  e071 quot     glyphicon-play before content  quot  e072 quot     glyphicon-pause before content  quot  e073 quot     glyphicon-stop before content  quot  e074 quot     glyphicon-forward before content  quot  e075 quot     glyphicon-fast-forward before content  quot  e076 quot     glyphicon-step-forward before content  quot  e077 quot     glyphicon-eject before content  quot  e078 quot     glyphicon-chevron-left before content  quot  e079 quot     glyphicon-chevron-right before content  quot  e080 quot     glyphicon-plus-sign before content  quot  e081 quot     glyphicon-minus-sign before content  quot  e082 quot     glyphicon-remove-sign before content  quot  e083 quot     glyphicon-ok-sign before content  quot  e084 quot     glyphicon-question-sign before content  quot  e085 quot     glyphicon-info-sign before content  quot  e086 quot     glyphicon-screenshot before content  quot  e087 quot     glyphicon-remove-circle before content  quot  e088 quot     glyphicon-ok-circle before content  quot  e089 quot     glyphicon-ban-circle before content  quot  e090 quot     glyphicon-arrow-left before content  quot  e091 quot     glyphicon-arrow-right before content  quot  e092 quot     glyphicon-arrow-up before content  quot  e093 quot     glyphicon-arrow-down before content  quot  e094 quot     glyphicon-share-alt before content  quot  e095 quot     glyphicon-resize-full before content  quot  e096 quot     glyphicon-resize-small before content  quot  e097 quot     glyphicon-exclamation-sign before content  quot  e101 quot     glyphicon-gift before content  quot  e102 quot     glyphicon-leaf before content  quot  e103 quot     glyphicon-eye-open before content  quot  e105 quot     glyphicon-eye-close before content  quot  e106 quot     glyphicon-warning-sign before content  quot  e107 quot     glyphicon-plane before content  quot  e108 quot     glyphicon-random before content  quot  e110 quot     glyphicon-comment before content  quot  e111 quot     glyphicon-magnet before content  quot  e112 quot     glyphicon-chevron-up before content  quot  e113 quot     glyphicon-chevron-down before content  quot  e114 quot     glyphicon-retweet before content  quot  e115 quot     glyphicon-shopping-cart before content  quot  e116 quot     glyphicon-folder-close before content  quot  e117 quot     glyphicon-folder-open before content  quot  e118 quot     glyphicon-resize-vertical before content  quot  e119 quot     glyphicon-resize-horizontal before content  quot  e120 quot     glyphicon-hdd before content  quot  e121 quot     glyphicon-bullhorn before content  quot  e122 quot     glyphicon-certificate before content  quot  e124 quot     glyphicon-thumbs-up before content  quot  e125 quot     glyphicon-thumbs-down before content  quot  e126 quot     glyphicon-hand-right before content  quot  e127 quot     glyphicon-hand-left before content  quot  e128 quot     glyphicon-hand-up before content  quot  e129 quot     glyphicon-hand-down before content  quot  e130 quot     glyphicon-circle-arrow-right before content  quot  e131 quot     glyphicon-circle-arrow-left before content  quot  e132 quot     glyphicon-circle-arrow-up before content  quot  e133 quot     glyphicon-circle-arrow-down before content  quot  e134 quot     glyphicon-globe before content  quot  e135 quot     glyphicon-tasks before content  quot  e137 quot     glyphicon-filter before content  quot  e138 quot     glyphicon-fullscreen before content  quot  e140 quot     glyphicon-dashboard before content  quot  e141 quot     glyphicon-heart-empty before content  quot  e143 quot     glyphicon-link before content  quot  e144 quot     glyphicon-phone before content  quot  e145 quot     glyphicon-usd before content  quot  e148 quot     glyphicon-gbp before content  quot  e149 quot     glyphicon-sort before content  quot  e150 quot     glyphicon-sort-by-alphabet before content  quot  e151 quot     glyphicon-sort-by-alphabet-alt before content  quot  e152 quot     glyphicon-sort-by-order before content  quot  e153 quot     glyphicon-sort-by-order-alt before content  quot  e154 quot     glyphicon-sort-by-attributes before content  quot  e155 quot     glyphicon-sort-by-attributes-alt before content  quot  e156 quot     glyphicon-unchecked before content  quot  e157 quot     glyphicon-expand before content  quot  e158 quot     glyphicon-collapse-down before content  quot  e159 quot     glyphicon-collapse-up before content  quot  e160 quot     glyphicon-log-in before content  quot  e161 quot     glyphicon-flash before content  quot  e162 quot     glyphicon-log-out before content  quot  e163 quot     glyphicon-new-window before content  quot  e164 quot     glyphicon-record before content  quot  e165 quot     glyphicon-save before content  quot  e166 quot     glyphicon-open before content  quot  e167 quot     glyphicon-saved before content  quot  e168 quot     glyphicon-import before content  quot  e169 quot     glyphicon-export before content  quot  e170 quot     glyphicon-send before content  quot  e171 quot     glyphicon-floppy-disk before content  quot  e172 quot     glyphicon-floppy-saved before content  quot  e173 quot     glyphicon-floppy-remove before content  quot  e174 quot     glyphicon-floppy-save before content  quot  e175 quot     glyphicon-floppy-open before content  quot  e176 quot     glyphicon-credit-card before content  quot  e177 quot     glyphicon-transfer before content  quot  e178 quot     glyphicon-cutlery before content  quot  e179 quot     glyphicon-header before content  quot  e180 quot     glyphicon-compressed before content  quot  e181 quot     glyphicon-earphone before content  quot  e182 quot     glyphicon-phone-alt before content  quot  e183 quot     glyphicon-tower before content  quot  e184 quot     glyphicon-stats before content  quot  e185 quot     glyphicon-sd-video before content  quot  e186 quot     glyphicon-hd-video before content  quot  e187 quot     glyphicon-subtitles before content  quot  e188 quot     glyphicon-sound-stereo before content  quot  e189 quot     glyphicon-sound-dolby before content  quot  e190 quot     glyphicon-sound-5-1 before content  quot  e191 quot     glyphicon-sound-6-1 before content  quot  e192 quot     glyphicon-sound-7-1 before content  quot  e193 quot     glyphicon-copyright-mark before content  quot  e194 quot     glyphicon-registration-mark before content  quot  e195 quot     glyphicon-cloud-download before content  quot  e197 quot     glyphicon-cloud-upload before content  quot  e198 quot     glyphicon-tree-conifer before content  quot  e199 quot     glyphicon-tree-deciduous before content  quot  e200 quot     glyphicon-briefcase before content  quot  1f4bc quot     glyphicon-calendar before content  quot  1f4c5 quot     glyphicon-pushpin before content  quot  1f4cc quot     glyphicon-paperclip before content  quot  1f4ce quot     glyphicon-camera before content  quot  1f4f7 quot     glyphicon-lock before content  quot  1f512 quot     glyphicon-bell before content  quot  1f514 quot     glyphicon-bookmark before content  quot  1f516 quot     glyphicon-fire before content  quot  1f525 quot     glyphicon-wrench before content  quot  1f527 quot

User · Answer

Migrating from Glyphicons to Font Awesome is quite easy  Include a reference to Font Awesome  either locally  or use the CDN    lt link href  quot https   maxcdn bootstrapcdn com font-awesome 4 7 0 css font-awesome min css quot  rel  quot stylesheet quot  gt   Then run a search and replace where you search for glyphicon glyphicon- and replace it with fa fa-  and also change the enclosing element from  lt span to  lt i  Most of the CSS class names are the same  Some have changed though  so you have to manually fix those

User · Answer

For people who are looking for one-liner solutions  you can import Bootstrap Glyphicons only   lt link rel  quot stylesheet quot  href  quot   netdna bootstrapcdn com bootstrap 3 0 0 css bootstrap-glyphicons css quot  gt

User · Answer

It is not shipped with bootstrap 4 yet  but now Bootstrap team is developing their icon library   https   icons getbootstrap com   https   github com twbs icons

[bootstrap-4] Bootstrap 4 - Glyphicons migration?

Examples related to bootstrap-4

Examples related to glyphicons