atisawd/boxicons

High Quality web friendly icons

boxicons's Issues

Download link broken

http://gum.co/boxicons
404s

Failed to load icon: linkedin

Hi! I would like to thank about your amazing work! And I need some help, this week I updated my boxicons to 1.9.2 version and I started to receive an error:

Failed to load icon: linkedin
Error: 404 Cannot find "/svg/logos/bxl-linkedin.svg" in [email protected]

I use React.js and My code is like that:

import 'boxicons';

<box-icon type='logo' name='linkedin'></box-icon>

I would like to know if I can do something about that.
Thanks!

Invoice and Leads Icons

Hello,

It would be cool if you can make an Invoice, Leads icon

Invoice example:

Leads example:

Thank you for your hard work 👍

24x24 viewbox for all Icons

Can you please make all the icons in 24x24 viewbox like in Material Icons so it would be easy for the designers to use it properly in design mockups. Example is shown in the image.

IMDB Icon Request

This seems like an excellent tool! The only thing preventing me from using it is the lack of an IMDB icon, having that would be super excellent.

Also some sort of submission template & guidelines would be neat, that way others can contribute with (hopefully) a minimal amount of "this is wrong" for new icons. Just a thought!

Lates set of SVG images are broken - missing viewBox attribute

Looks like the last update ( v1.8.0 ) broke the use of SVG images - the viewBox="0 0 24 24" was removed from the <svg> tag, which mean we are not able to apply different sizes to them - they are fixed at 24x24.

You should be able to see this issue if you use the web component <box-icon>.

ES6 support / docs?

Is there a way to import them as ES6 module?

import '~/boxicons/css/boxicons.css';

Something like this?

Failed to load icon: detail

Hello,
I have the following error when trying to use the detail solid icon:

Failed to load icon: detail
Error: 404 Cannot find "/svg/regular/bx-detail.svg" in [email protected]

(The icon displays correctly though)

Optimize SVG files

First of all, thanks for these icons! I was wondering if it is possible to add optimized versions of the SVG icons - currently they contain a lot of things that can be removed, like Illustrator comments and doctype. Using a tool like svgo this can easily be achieved. Would be happy to make a PR too!

bx-lg class does not work in 2.0.3

In the minified version at https://cdn.jsdelivr.net/npm/[email protected]/css/boxicons.min.css the "rem" unit in .bx.lg is missing.
It should be .bx-lg {font-size:3.0rem!important} to work. The unminified version it's ok though.

At first it is not evident because in https://boxicons.com/usage/#sizing you are using a non-exitent icon "smiley-happy" bringing an empty frame in the demostration.
If you use i.e. "smile" you'll see the effect clearly:

<div class="sc-1uawk0q-0 iHBVeo">
<i class="bx bxs-smile bx-xs "></i>
<i class="bx bxs-smile bx-sm"></i>
<i class="bx bxs-smile bx-lg"></i>
<i class="bx bxs-smile bx-md"></i>
</div>

BTW thank you for your great work!

Font doesn't fill the space

Hi,

I want to use boxicons on my project however it doesn't align perfectly with text.
See the screenshot, box icons have 30x30 space, but it doesn't fill the space.

In comparison font awesome icon (on the right) fill the space perfectly, so it align perfectly with text.
Any idea how to fix this?

Not showing right icons

I have tried some icons with fonts and class but those were not showing the right icons...

Pinterest icon request

Icons issue :before :after

Hi 👋,

We wanted to update the new version of boxicons but we have some problems 🤔

The problem is that sometimes we used your font via unicode to display icons via css ::before & ::after. And the unicodes have completely changed ...

Example, for the icon caret-down-circle we used the unicode "\ebae" and after the upgrade of boxicons, this icon has changed to show us a totally different icon...

Do you have a solution to avoid this problem?

Thanks you!

show utf8 code on website

Show stuff like this \ea23 on website for each icon. The alternative is having to search through the css to find it :P

Facebook's New Icon Request

Request: Pointer icon

Something that looks like a mouse cursor.

Add woff2 format

WOFF2 uses custom preprocessing and compression algorithms to deliver ~30% file-size reduction over other formats. For more information, see the WOFF 2.0 evaluation report

Do you have an API ?

Im thinking of makeing creating an wordpress plugin which basic fetches your icons and makeing it possible for the users to ad them into there website.

So yo my question, do you have an api i can use when i develop the plugin to make it possible to fetch all your icons and show theme for user. and then be able to save an slug or id etc in the database.

Lovley icons btw :D

Dear,
Emil

up-arrow-circle === down-arrow-circle (solid)

up-arrow-circle and down-arrow-circle both result in down-arrow-circle (solid)

• documentation
• implementation via web-components

Expected behavior is that up-arrow-circle has an arrow pointing up.

Currency icon Request

I like the styling of BOX ICON just loving each and every icon thanks to the team Box Icon, would suggest having Currency icon:

bitcoin, dollar-sign, euro-sign, lira-sign, pound-sign, ruble-sign, rupee-sign, shekel-sign, won-sign, yen-sign

Thanks
Prameshwar

Logo icons - broken CDN path

Hey,

logo icons seem to not be working properly in v1.9.
I'm currently on a Vue project and importing the Web Component as such
import 'boxicons'

However, when attempting to display any of the logo icons (eg: <box-icon type="logo" name="twitter"></box-icon>), I get this in console:
Error: 404 Cannot find "/svg/logos/bxl-facebook-square.svg" in [email protected]

Changing /logos/ to /logo/ fixes the issue.

Icon request: shield with X

Hello, there's an check-shield icon which can be used for e.g. marking that something is secured. For expressing the opposite - i.e. that something is not secured, it would be great to have a shield with X sign instead of check symbol or possibly shield with strike through.

Something like this:

Icon request: refresh

Thanks for great icon pack!

Upload ( Solid )

Equivalent to bxs-download

Google Chrome blocks due to CORS policy.

When working in Chrome, using the web components installed with npm install boxicons doesn't yield anything, due to the Cross-Origin Resource Sharing policy. This was the console error:

Access to XMLHttpRequest at 'http://unpkg.com/[email protected]/svg/regular/bx-loader.svg' from origin 'http://localhost:5000' has been blocked by CORS policy: The response is invalid.

Do you know how I can fix this? I am using Flask and React as well, but I wouldn't think those would have any impact.

What about a plane icon and a money icon (instead of dollar)..thanks

What about a plane icon and a money icon (instead of dollar)..thanks

Design Guidelines for Contributing New Icons

It would be great if there are guidelines for contributors in the documentation.

Examples could be found at Feather Icons or Simple Icons

Any information on dimensions and constraints for current icons would be great.

Also setting guidelines for icon requests would make it easier to submit and clear any ambiguity.

Setting up a project for adding new icons based on those requests will enable faster checking when adding new icons in the future.

Stroke icons

It will be the greatest icon set if you add solid(stroke) icons with 1px lines

Request scanning icon

I love Boxicons and please I request scanning icon.

Call Regular has been removed

Hello team,

I was using this icon <i class="bx bx-phone-call"></i> in v1.8.1 I see it is missing from the latest version 1.9.1, can you please clarify why it has been removed or when it will be added back?

Some icons were removed from 2.0.3 :-(

Hey! Thank you very much for your work in boxicons, they're awesome!! 😍

I have noticed that in latest release (2.0.3) some icons were removed, like bx-truck, bx-ambulance, bx-bicycle, bx-dashboard and bxs-thermometer (it comes back in 2.0.4🎉) and I was using some of them...

Was it deliberate or it was an error? I would like to get them back! 😸

Warning or Danger Icon

adobe XD plugin

I've been working on a plugin for adobe xd which allows users to choose an icon from the boxicons library. I know that the library license is MIT, but I thought it would be polite to inform you that it might go live. Also, I was wondering whether when it is finished, if it can become the "official" boxicons xd plugin. That would allow me to use the boxicons logo and the boxicons homepage.

The working repo is here

Cheers!

please add a icon for PDF

It would be great to have a icon for a document in PDF format.

Many thnx for the wonderful icons

Icon requests - exclamation/warning

something like https://fontawesome.com/icons/exclamation-triangle?style=solid.

thanks :)

Icon request: arrows pointing to left-top, right-top, left-down, right-down

Similar to e.g. right-down-arrow-circle but without the circle.

Thanks for great icon pack!

Request Jquery icon

Hii I'm Bariq. I'm a fans of boxicons. Can we request an jquery icon in boxicons maybe? That would be awesome. Thank you!

Dialpad icon

There are volume icons, phone icons, and mic icons. Can you maybe add a dialpad icon?

What's the license?

Hi there, I'm building a library, and I'm wondering if I can use boxicons in my library, if so, what are the terms here?

You cannot change the fill of some icons via css

In some icons when using them and trying to change the fill to another color does not change because it is set in the svg

the icons with this problem, for example the one on redit, I have to grab the svg and remove that fill manually to make it work

I am using the web component library

example

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
                        <g fill="#12100E"> <-------///----
                          <circle cx="9.67" cy="13" r="1.001"/>
                          <path d="M14.09 15.39C13.483 15.826 12.746 16.041 12 16c-.744.034-1.479-.189-2.081-.63-.099-.081-.242-.081-.342 0-.115.095-.132.265-.037.38.71.535 1.582.808 2.471.77.887.038 1.76-.234 2.47-.77v.04c.109-.107.111-.285.006-.396C14.377 15.284 14.2 15.282 14.09 15.39zM14.299 12.04c-.552 0-.999.448-.999 1.001 0 .552.447.999.999.999l-.008.039c.016.002.033 0 .051 0 .551-.021.979-.487.958-1.038C15.3 12.488 14.853 12.04 14.299 12.04z"/>
                          <path d="M12,2C6.479,2,2,6.477,2,12c0,5.521,4.479,10,10,10s10-4.479,10-10C22,6.477,17.521,2,12,2z M17.86,13.33 c0.011,0.146,0.011,0.293,0,0.439c0,2.241-2.61,4.062-5.83,4.062c-3.221,0-5.83-1.82-5.83-4.062c-0.012-0.146-0.012-0.293,0-0.439 c-0.145-0.066-0.275-0.155-0.392-0.264c-0.587-0.553-0.614-1.477-0.063-2.063c0.552-0.588,1.477-0.616,2.063-0.063 c1.152-0.781,2.509-1.209,3.899-1.23L12.45,6.24c0-0.001,0-0.002,0-0.004C12.487,6.069,12.652,5.964,12.82,6l2.449,0.49 c0.16-0.275,0.441-0.458,0.758-0.492c0.55-0.059,1.042,0.338,1.102,0.888c0.059,0.549-0.338,1.042-0.889,1.101 c-0.548,0.059-1.041-0.338-1.102-0.887L13,6.65l-0.649,3.12c1.375,0.029,2.712,0.457,3.85,1.23 c0.259-0.248,0.599-0.393,0.957-0.406c0.807-0.029,1.483,0.6,1.512,1.406C18.679,12.562,18.363,13.08,17.86,13.33z"/>
                        </g>
                      </svg>

Script to inject SVG icons into HTML

if someone could help with the script to inject the SVG icons into HTML using JS , would really appreciate it.

Artboard icon request

Love boxicons. Would be great if their was an icon somewhat like this.

Right Arrow, Up Arrow & Down Arrow Icons

Please add more arrow icons like right, up and down.

What about a LinkedIn icon?

I see that you have a lot fo social media icons but why no LinkedIn icon?

Edge support

For some reason all the SVG icons are blank in Edge. Regularly font icons works fine. From what i can find Edge supports SVG. So i'm not sure what's going on.

I'm using the icons on a locally run projects.

error: failed to load icon quote-alt-left

When I use the icon component in react, and I try to use

<Box-icon name="quote-alt-left" type="solid" />

I get the following error (icon displays correctly, though)

Failed to load icon: quote-alt-left
Error: 404 Cannot find '/svg/regular/bx-quote-alt-left.svg' in [email protected]

I took a peek in the js, and I couldn't find anything amiss. Thanks!

Icon Requests

I'm a big fan of BoxIcons and use it on my site https://1mb.site

I would love icons similar to bxs-file-pdf that say stuff like html, css, js, json, md, txt, png, jpg, gif, etc. Would be really useful to me! Thank you in advance :)

Request love icon

Hii Boxicons! I'm pretty love with your icons. But I just realized you don't have love icon. I think you must add a love icon to your library icon, thank you!

Choose line scale

I want to give you an idea since you can't click the pull request.
Put in BoxIcons a function to be able to change the expression of any icon that would make it much easier to draw.