Stack Overflow
Stack Overflow

Questions tagged [bootstrap-icons]

Use this tag for questions involving the usage of the official open source library of SVG icons for Bootstrap. While designed for Bootstrap first, these icons can work in just about any project, and even with other UI frameworks.

Bootstrap Icons

Official open source SVG icon library for Bootstrap.

Bootstrap Logo

Bootstrap Icons are designed to work with Bootstrap components, from form controls to navigation. But, they'll work in just about any project, too. That's because Bootstrap Icons are SVGs, so they scale quickly and easily and can be styled with CSS.

They're open sourced (MIT), so you're free to download, use, and extend any icon. Every SVG can be copied from right here, or you can use the SVG sprite.

Official page : https://icons.getbootstrap.com/
Install : https://icons.getbootstrap.com/#install
Usage : https://icons.getbootstrap.com/#usage
Github Repo : https://github.com/twbs/icons

45 questions
0
votes
2 answers

Can't use Bootstrap Icon in ASP.NET Core 6

I have installed Bootstrap icon like this link: https://icons.getbootstrap.com/#install This is how I import the link and create the CSS file for Bootstrap Icon: But then it still doesn't work. I still can't use the icon: Did I do something…
Hung Doan
  • 31
  • 1
  • 5
0
votes
2 answers

Why only some of Bootstrap Vue icons work in a vue app using the latest Bootstrap Vue?

I have installed Bootstrap Vue using the instructions here: https://bootstrap-vue.org/docs/icons I am on the latest version of each dependency: "bootstrap": "^5.2.0", "bootstrap-icons": "^1.8.1", "bootstrap-vue": "^2.22.0", In my src/main.js I am…
keyboard-warrior
  • 324
  • 2
  • 11
0
votes
1 answer

Are these icons missing from the Bootstrap icons web font, or am I doing something wrong?

I'm using the web font for Bootstrap Icons, and most of my icons are working, but there are a few which are listed on the website that don't seem to be included in the web font. These include: bi-envelope-plus,bi-quote and bi-mortarboard. I'm using…
KinsDotNet
  • 1,500
  • 5
  • 25
  • 53
0
votes
1 answer

Userfriendly possibillity to select an icon from large iconset

I have a webapplication where a User can add a new category. The category is beeing inserted to database with form post. This category should have an icon (bootstrap icons https://icons.getbootstrap.com/) which the User should be able to select. I…
Pherox65
  • 5
  • 2
0
votes
2 answers

How to change bootstrap icon's attributes using javascript

I need - To create a bootstrap icon (heart) when DOM content is loaded When the icon is clicked, the heart icon fills with red (Here I use heart-fill icon) Both of the icons to be larger than the…
Omayer Hasan Marif
  • 343
  • 2
  • 11
0
votes
1 answer

Bootstrap Bigger Icon

in the screenshot below, i have tried to add 2 button icons in 2 different columns which are also children of a row. I want that buttons to fit as much as big they can in the column as you see. Here is my code for that specific row;
Ekim Cem Ülger
  • 50
  • 6
0
votes
2 answers

bootstrap icon not aligning in button

My search button on the navbar has a bootstrap icon and text that are not aligning vertically Fiddle link: Fiddle html for the search:
Deuel Ellan
  • 481
  • 1
  • 4
  • 12
0
votes
0 answers

Add Bootstrap Icon In Input's Placeholder

I am trying to put Bootstrap search icon in the placeholder of . However as it is obvious that I cannot just write
a_man
  • 194
  • 1
  • 11
0
votes
1 answer

How to import Bootstrap5 font icons for use in Vue2 and tree shake?

I am creating a Vue2 app and want to use Bootstrap5 icons. Specifically, I want to be able to use the "icon font" type (ie, ) instead of embedding an SVG element. So, I have installed the npm package like so: npm i…
redshift
  • 4,815
  • 13
  • 75
  • 138
0
votes
1 answer

Bootstrap-Icons font not included in PCF control

I'm trying to use Bootstrap Icons in my PCF control, and I'm having problems displaying the icon because the fonts are not being included Including Bootstrap-Icons: npm i bootstrap-icons produces the following package.json { "name":…
jasonscript
  • 6,039
  • 3
  • 28
  • 43
0
votes
1 answer

Angular flickering icons

I implemented a simple button with Angular 11 and bootstrap and bootstrap-icons. When I route the page which shows the button the button is loaded immediately. But only when ~500ms elapsed the icon pops up and looks like flickering. How can I get…
sampa
  • 535
  • 4
  • 27
0
votes
2 answers

How to add an icon before the text?

In the Drupal Commerce purchase funnel, there are images for each step of the order. I would like to replace the images with SVGs. Here is the CSS : .checkout-progress--step__previous:after { min-width: 10px; line-height: 1; white-space:…
mlllmmlml
  • 113
  • 1
  • 1
  • 8
-1
votes
1 answer

My bootstrap icons logo is appearing square

I have included my Boostrapmin and bootstrap icon CSS as well. this icon I am trying to use. but it appears as square. css is applied I can see it in inspect element of google chrome.
user17504907
-1
votes
2 answers

How to use Bootstrap icon?

My HTML I want to use Bootstrap icon inside tag. In response getting [] (square).
ॐkar
  • 15
  • 1
  • 6
-2
votes
1 answer

Is there any way to change Bootstrap CSS icon on mouse hover

I have a Bootstrap dropdown in Angular. For dropdown menu I am using bootstrap css chevron-right icon. When user mouse hover, I want to change it to chevron-down icon. This is my code