Bootstrap stroke icons (BSS) is free of charge vector icon set created for famous Twitter Bootstrap project. Glyphicon set is used by default and Bootstrap version 3.2 contains 200 icons. BSS uses stroke style and contains 205 fully compatible icons.
Just save and open preview example of the icons.
We already prepared for you ready to use files.
- After Bootsrap installation replace file refererence from
bootstrap.min.cssto corrected one at jsdelivr in theHEADsection of your page. To use Bootsrap 3.2.0 with Bootsrap-Stroke font just add reference to
<link href="https://cdn.jsdelivr.net/bootstrap-stroke/1.0.1/css/bss-bootstrap.3.2.0.min.css" rel="stylesheet" type="text/css">
This is it.
bss-bootstrap.3.2.0.min.css is a based on bootstrap.min.css and differs only in font reference.
CDN provided by jsdelivr is a file hub with fast access from any world point.
For experienced users we provide .less files for private customization. After downloading Bootstrap source files make changes to the next files in less folder:
-
Copy
icons.lessfile from our source to Bootstrap less folder. -
Inside Bootstrap project edit
bootstrap.lessfile and remove or comment line@import "glyphicons.less";, then include line@import "icons.less"; -
Edit
variables.lessfile and change Iconograpfy variables to
//** Load fonts from this directory.
@icon-font-path: "../fonts/";
//** File name for all font files.
@icon-font-name: "bootstrap-stroke"; // default: "glyphicons-halflings-regular";
//** Element ID within SVG icon file.
@icon-font-svg-id: "bootstrap-stroke"; // default: "glyphicons_halflingsregular";
//** Font family name
@icon-font-family: 'Bootstrap stroke'; // default: "Glyphicons Halflings";
//** Prefix is used in icons class declaration
// <span class="glyphicon glyphicon-star">
// <span class="bss bss-star">
@icon-font-prefix: bss; // default: glyphicon;
Customize on your needs the font variables and then compile bootsrap.less to css file.
Applying css file from jsdelivr CDN there will not be any changes in using icons. Same code is valid as in Bootsrap project, for example <span class="glyphicon glyphicon-star" />.
In case of custom prefix like @icon-font-prefix: bss; use <span class="bss bss-star" />.
Read more about icon applying at Bootsrap Help.
Code: MIT, fonts: Creative Common 2.0
