Coder Social home page Coder Social logo

icons's Introduction

Bootstrap logo

Bootstrap Icons

Official open source SVG icon library for Bootstrap.
Explore Bootstrap Icons »

Bootstrap · Themes · Blog

670+ icons

Bootstrap Icons full set

Also available in Figma.

Install

Bootstrap Icons are packaged up and published to npm. We only include the processed SVGs in this package—it's up to you and your team to implement. Read our docs at for usage instructions.

npm i bootstrap-icons --save

Development

Build Status

Clone the repo, install dependencies, and start the Hugo server locally.

git clone https://github.com/twbs/icons/
cd icons
npm i
npm start

Then open http://localhost:4000 in your browser.

npm scripts

Here are some key scripts you'll use during development. Be sure to look to our package.json for a complete list of scripts.

Script Description
start Alias for running docs-serve
docs-serve Starts a local Hugo server
pages Generates permalink pages for each icon with template Markdown
icons Processes and optimizes SVGs in icons directory

Adding SVGs

Once a new SVG icon has been added to the icons directory, you'll need to optimize them. An npm script is used to:

  1. Optimize our SVGs with SVGO.
  2. Modify the SVGs source HTML, removing all attributes before setting new attributes and values in our preferred order.

Use npm run icons to run the script, run npm run pages to build permalink pages, complete those pages, and, finally, commit the results in a new branch for updating.

Publishing

Documentation is published automatically when a new Git tag is published. See our GitHub Actions and package.json for more information.

License

MIT

Author

@mdo

icons's People

Contributors

mdo avatar xhmikosr avatar dependabot-preview[bot] avatar coliff avatar beckenrode avatar psjishnu avatar johann-s avatar inwardmovement avatar jorimvanhove avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.