lucide-icons / lucide Goto Github PK
View Code? Open in Web Editor NEWBeautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons.
Home Page: https://lucide.dev
License: ISC License
Beautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons.
Home Page: https://lucide.dev
License: ISC License
Sun with the word UV written inside for use for UV index in weather map
To use for percipation probability
Three droplets that are going diagonally, from bottom left to top right. Will look like rain that is falling in the wind.
The rain icon is not very beautiful, and the droplets should go diagonally.
I think it's a good idea to have a different visual identity to the official Feather project.
Here is a potential logo:
It is a combination of the GitHub octicons repository
icon (to represent the "community" part of this project) and the feather
icon (to stay true to our parent project).
(source: https://fontawesome.com/icons?d=gallery&q=file-code)
Hey there ๐
I'm working on the team in the process of migrating a website from one tech stack to another. In the process, we are migrating from font-awesome to feather icons. I see a lot of file
type icons, but would also love one that looks similar to the screenshot above.
I'd PR this myself, but as an engineer and non-designer, I can't say I know the toolset well enough to know where to begin ๐ . Thanks for the help ahead of time!
I put together a solitaire game for android. First I tried using the unicode symbols, but was surprised to learn that they commonly receive a fixed coloring when rendered as text (i.e. spades and clubs are black and diamonds and hearts rendered red, despite explicit application text styles). This was true in my case, due to whatever rendering engine treats Flutter Text
elements.
So I looked for some SVG's for it, and found some that worked well enough. I find after playing the game a bit though, at the scale of my phone's display, the spades icon (โ ) and clubs icon (โฃ) are not differentiated well enough, causing some eye strain.
I did not see any great alternatives in other icon sets. I can try to submit a PR if it's a welcome addition here.
in the app, without enough differentiability:
these clubs are visually different from the spades, the lobes (?) of the clubs are nearly completed circles:
standard cards showing similar style, good difference between clubs and spades
this is an example of not-so-great difference spades/clubs, unfortunately prevalent among free icon svgs
here's a vintage style clubs which seems to completely differentiate from spades, but it's less iconic, my preference would be similar to the standard cards above
Three droplets, to use for air humidity in weather app.
Hi!
Is there any chance that Featherity can be compiled to TTF?
Thanks ๐ค
Can you please tell me where to put new icons to be visible on the site when it's deployed?
Issue
The input field has a border-radius but the chakra-input__group css-r27y85
element is poking out underneath. On light mode this is not an issue since the color of the element is the same as the body.
Solution
Give the chakra-input__group css-r27y85
element the same border-radius as the input.
or
Give the chakra-input__group css-r27y85
element the same background-color as the body. (Maybe this messes up the color of the input.)
Issue
The color input elements have a border-radius on the bottom with no padding to the box below.
Solution
Maybe put no border-radius on the bottom corners. I also think that the color field could have a border around it. Looks a lot better on the bright side.
Alternatively, some margin between the input and color field.
I'm not really working on anything else than icons, but IMO we shouldn't use only 1 repository (e.g. icons, npm package, etc...)
Super specific request, you may close this. I figure it could be possible to do a boat and telescope (tripod with a tube) in svg.
Nautical dusk: Sunset with a boat in the background.
Astronomical dusk: Sunset with a telescope in the background
Nautical dawn: Sunrise with a boat in the background.
Astronomical dawn: Sunrise with a telescope in the background.
luicide icons are soo underrated, why don't you guys develop a plugin for Figma?
@johnletey Some open/old PRs from your old account in the feather repo have some awesome icons!
I think we can add them to Lucide.
Here is a list of the icons I think are welcome to add to the Lucide repo!
More PR from John
Regarding to the thread in #57 @llaenowyd said this:
I think after re-reading the submission guidelines , maybe there should be one PR for each icon.
I certain way I think this is a good idea to write this down in CONTRIBUTING file.
For me it's a little-bit of an unwritten rule that you need to submit icons or "icon series" in separate pull-requests for several reasons:
I'm curious what you think.
What design direction should we go in for Reply, Reply All, and Forward?
In the request issues on Feather, two example designs were given, similar to the icons in Outlook and Gmail.
Requests from feather:
Reply: feathericons/feather#380
Replay All: feathericons/feather#381
Forward: feathericons/feather#384
Outlook (simple lines):
Gmail (filled shapes):
I prefer the Gmail approach a bit more and I made icons for reply and reply all:
The searched query clears when selecting the icon.
I'm almost done with creating the react package, and for that I need to write some documentation as well.
With that, maybe it is nice to centralize the documentation.
I got a bit inspired by the ChakraUI website, I think they have an great, simple and nice looking documentation site. I noticed they use their own UI + next.js, the same as we do. And they use enhanced markdown to generate documentation pages. (.mdx
files), see their [next.config.js](https://github.com/chakra-ui/chakra-ui/blob/develop/website/next.config.js)
.
So maybe we can use that as well.
Maybe something like :
Featherity is a fork of Feather Icons made by the community. We try to expand the icon set as much as possible while keeping it nice-looking - join us!
I don't know about using Yarn, so I'm not sure, but I think the packages folder shouldn't be committed?
Sorry for posting so many issues, thank you for a great fork!! Exactly what I've been looking for. I have some more suggestions for weather icons:
Hot weather: A thermometer with a sun
Windy weather: Three curvy strokes that looks like someone is blowing.
Heavy showers: Cloud with rain that goes diagonally,
Cold temperature: Thermometer with a snowflake.
Clear night: Moon but with two stars, one small and one a bit larger.
Partly cloudy: Cloud with sun in the back.
Thunderstorm: Cloud with a lightning.
Suggestion:
Nicer looking cloud and snowflake.
The original clouds doesn't look very nice, it's hard to see that they are clouds. Do them a bit like this instead, and also the snowflake.
When was designing the align icons I came across the menu icon.
I like the menu icon, but I think the current one look a bit too rectangular.
So made the length of the line a bit shorter, so it is more squared.
Also the menu icon is often displayed without text and used in an squared element.
I'm curious what you think of this change.
I was browsing around the code and Cole Bemis's email is still in the Code of Conduct as the project contact. May want to change that.
Add tags related to the icons, like on feathericons.com. This allows for easier search and discovery of the icons.
The search bar, the "download all" button and the hovered cards are illegible.
Ideally, an icon for each of the possible license types, but at minimum just the cc enclosed in a circle. I will design them myself in the coming week or two if no one else does.
We should change the repo's description.
Maybe "Simply beautiful open source icons, community-sourced"?
The README has a lot of content added but its Table of Contents was not updated.
Hey I thought maybe we can think about how we can build the community.
I wrote down some ideas, maybe you can help and share your ideas as wel.
Let me know what you think!
since this is a fork of feather icons, would be good to have some sort of indication for icon status.
ie. whether an icon is โ
(a) unchanged from feather,
(b) modified from feather, or
(c) new icon not shipped in feather.
This could either be a standalone docs page on GH or if integrated into https://lucide.netlify.app it could be in the form of a dot or triangle
as there's currently no changelog (that I can see), the only way to find out if icons have changed or new from feather is to compare them or go through the commit history
pros for current feather users โ
able to do a quick glance on what the new sets are; easily allow designers/devs to make the judgement call on whether or not to switch. and if so, whether icons have been modified to avoid surprises
perhaps would look something like this โย
thoughts?
I can submit a PR if you agree that one is the best option!
I use yarn workspaces
, and as I moved lucide-react
to the root package.json
, I got an error: duplicate-react. At the moment I fixed the problem via yarn resolutions
, to make sure to install only one react version. I think, react
a well as prop-types
should be peer-deps
.
There are stil some great icons waiting to be merged in the feather repo.
Do you think we can just take their code and contribute it to this repo? ๐ค
Or do we need to ask them to do that.
For example the #813, the dice icon look cool to me.
Since we don't add any brand icons, I think we should remove the current ones. What do you think?
Legend: โ Added | ๐ง Under construction | โ Unsure | ๐ฅ Rejected
Done | Id | Title | Engagement | Feather PR | Lucide PR |
---|---|---|---|---|---|
โ | #17 | Wallet | 4 | #658 | #193 |
โ | #21 | newspaper | 0 | #661 | |
โ | #27 | gender | 15 | #46 | |
โ | #28 | media-controls/repeat-1 | 6 | #655 | |
โ | #32 | Food Icon | 6 | #680 | |
โ | #53 | factory | 0 | #558 | |
โ | #56 | forest | 6 | #714 | |
โ | #61 | Campsite | 4 | #651 | #331 |
โ | #68 | bed | 9 | #662 | #689 |
โ | #69 | sofa | 0 | #689 | |
โ | #70 | bath | 0 | #635 | |
โ | #86 | sum | 17 | #660 | |
โ | #98 | podcast | 0 | #132 | |
โ | #100 | money | 8 | #670 | |
๐ฅ | #113 | Filled thermometer | 0 | ||
โ | #149 | cake | 2 | #601 | |
๐ฅ | #156 | Filled circle | 2 | ||
โ | #157 | RFI: Trophy | 10 | ||
โ | #182 | Currency | 41 | #404, #670 | |
โ | #185 | Hobby Icons | 1 | ||
โ | #198 | User in Circle | 4 | #692 | #1116 |
โ | #200 | Sort/Filter together | 0 | ||
๐ฅ | #210 | Fax | 0 | #602 | |
โ | #220 | Sword/swords | 0 | #823 | #646 |
โ | #221 | Camera Lens | 5 | #634 | |
โ | #234 | chevrons-up-down | 6 | #238 | |
โ | #264 | Rx/Pill | 0 | #605 | |
โ | #266 | car | 1 | #789 | |
โ | #280 | Vibration / Haptic Icon | 0 | #297, #641 | |
โ | #281 | Skull | 0 | #298 | |
โ | #291 | Icon request : history | 10 | #188 | |
โ | #316 | Megaphone | 0 | #214 | |
โ | #321 | PDF File | 8 | ||
โ | #322 | XLS File | 1 | ||
โ | #337 | Ellipsis Circle | 0 | ||
โ | #339 | Zip file | 5 | #606 | |
โ | #347 | Ticket icon | 2 | #220 | |
โ | #351 | Keyboard | 3 | #522 | |
โ | #353 | Open Folder | 5 | #381 | |
โ | #355 | New header icons | 0 | ||
โ | #367 | Thumbtack | 0 | #438 | |
โ | #380 | reply | 1 | #341 | |
โ | #381 | reply all | 0 | #341 | |
โ | #384 | forward | 0 | #341 | |
โ | #386 | brush icon | 0 | #108 | |
โ | #399 | Code with Forward Slash | 11 | #671 | #280 |
โ | #401 | Bank | 11 | #347 | |
โ | #407 | Pin | 0 | #438 | |
โ | #413 | icon request - scaling | 8 | #717 | |
โ | #418 | Barchart Grouped (related with Barchart Stacked) | 0 | ||
โ | #419 | Barchart Stacked (related with Barchart Grouped) | 0 | ||
โ | #421 | Layout Mode | 0 | ||
โ | #422 | Info Copy | 2 | ||
โ | #426 | Flip / Mirror | 0 | #622 | |
โ | #427 | Text input | 0 | #235 | |
โ | #437 | Webcam | 8 | #687 | #192 |
๐ฅ | #438 | Meeting/ collaboration | 2 | ||
๐ง | #444 | Hand Icons | 0 | #608 | |
โ | #452 | half-star | 3 | #642 | #180 |
โ | #459 | Newspaper | 2 | #661 | |
โ | #463 | bidirectional and non-bidirectional synching | 1 | ||
โ | #467 | Transportation Icons | 12 | #789 | #152 |
โ | #468 | cat | 0 | #498 | |
๐ง | #471 | Walking | 0 | #609 | |
โ | #472 | bird | 0 | #610 | |
โ | #473 | Puzzle/Module Icon | 1 | #633 | |
โ | #486 | business | 0 | #608 | |
โ | #489 | Crown | 11 | #664 | #151 |
โ | #505 | Quote | 6 | #653 | #389 |
โ | #508 | Cursor | 9 | #897 | #454 |
โ | #509 | AI | 0 | #612 | |
โ | #510 | Superscript | 0 | #471 | |
โ | #511 | Subscript | 0 | #459 | |
โ | #514 | Mask | 3 | #631 | |
โ | #529 | file-check, file-x, folder-check, folder-x | 16 | #669 | |
๐ง | #550 | Question Mark v2 | 7 | ||
โ | #552 | Utensils Icon | 12 | #629 | #261 |
๐ง | #557 | HD icon | 21 | #659 | |
โ | #559 | Swipe/Drag icon | 6 | #641 | |
โ | #586 | Receipt | 2 | #615 | |
๐ฅ | #594 | Digits | 19 | #649 | |
โ | #598 | QR Code | 32 | #141 | |
โ | #601 | Hand Waving | 0 | ||
๐ฅ | #609 | Save As | 13 | #700 | #645 |
โ | #631 | "boat" | 1 | #665 | |
โ | #633 | disability | 10 | #199 | |
โ | #683 | add medal | 8 | ||
โ | #685 | double check | 4 | ||
โ | #686 | usb | 9 | #703 | #617 |
๐ฅ | #695 | spinnable loading | 13 | ||
๐ฅ | #697 | fence | 6 | #618 | |
โฌ๏ธ | #705 | digital watch | 4 | ||
โ | #753 | timer | 1 | #735 | #148 |
โ | #754 | move-horizontal/-vertical | 1 | #770 | |
๐ฅ | #782 | debug | 2 | ||
โ | #793 | glasses / spectacles | 5 | #149 | |
๐ฅ | #794 | contact lenses | 1 | ||
โ | #811 | car | 11 | #152 | |
โ | #812 | dice | 5 | #918 | #655 |
โ | #831 | / proposal helping hand | 0 | #836 | #614 |
โ | #841 | location disabled / error | 2 | ||
โ | #853 | menu open | 7 | ||
โ | #855 | all text editor s | 1 | ||
โ | #865 | dollar-sign-circle | 1 | #1118 | |
โ | #879 | fuel icon | 3 | #656 | |
๐ง | #885 | categorical/text data (abc) | 2 | ||
โ | #916 | queue | 0 | ||
โ | #949 | square academic cap / university / school | 8 | ||
โ | #954 | audience/group | 4 | ||
โ | #961 | current location | 4 | ||
โ | #965 | soft drink \ cold drink | 0 | #674 | |
โ | #966 | mountain | 0 | #284 | |
โ | #968 | sprout | 0 | #157 | |
โ | #990 | plane | 0 | #150 | |
โ | #991 | holiday/vacation/palm tree | 0 | #492 | |
โ | #1002 | Raise Hand and Lower Hand | - | ||
โ | #1006 | Restaurant Icon | - | ||
โ | #1007 | Qite/Quote Icon | - | ||
โฌ๏ธ | #1019 | Icon request: Story | - | ||
โ | #1020 | Icon Request: shopping-cart-full | - | ||
โ | #1024 | Icon Request: Infinity | - | ||
โ | #1025 | Icon Request: Boat on Water | - | ||
โ | #1026 | Icon Request: Cell Tower | - | ||
โ | #1027 | Icon Request: Car | - | ||
โ | #1030 | Numbered List | - | ||
โ | #1053 | Icon Request: clouds-fog | - | ||
โ | #1062 | Icon Request: Boost | - | ||
โ | #1064 | Icon request: Leaf | - | ||
โ | #1069 | Bug icon | - | ||
โ | #1078 | Icon request: Exit | - | ||
โ | #1087 | Icon Request: Chess Piece | - | ||
โ | #1099 | Rupee Sign (โน) | - | ||
โ | #1105 | Earth icon request | - | ||
โ | #1107 | Icon request: eraser | - | ||
โ | #1109 | Icon request: bounding-box | - | ||
โ | #1113 | arrow-up-down | - | ||
โฌ๏ธ | #1127 | Icon request: Motorbike | - | ||
โ | #1128 | Drag handle icon | - | ||
โฌ๏ธ | #1130 | Icon Request: Refund | - | ||
โ | #1136 | Memory/Ram Icon | - | ||
โ | #1141 | Icon request: Ruler | - | ||
โ | #1142 | Icon request: Eraser | - | ||
๐ฅ | #1144 | Arepa Icon | - | ||
โ | #1149 | Icon Request: JSON / cidy brackets | - | ||
โ | #1152 | Icon request: Nodes connection | - | ||
โ | #1153 | Icon request: Bomb | - | ||
โ | #1164 | Icon Request:ย Follow System UI Dark Mode | - | ||
โ | #1165 | Icon Request: undo | - | ||
โฌ๏ธ | #1177 | Ambulance icon | - | ||
โฌ๏ธ | #1178 | Hospital | - | ||
โ | #1179 | Roller-coaster | - | ||
๐ง | #1180 | Briefcase-medical | - | ||
โฌ๏ธ | #1181 | Clipboard-medical | - | ||
โฌ๏ธ | #1182 | Home-medical | - | ||
โ | #1183 | Star-of-life | - | ||
โ | #1184 | Syringe | - | ||
โ | #1185 | Tablets | - | ||
โ | #1186 | Heart-pulse | - | ||
โฌ๏ธ | #1187 | Bandage | - | ||
โ | #1188 | Icon Request: palette | - | ||
โ | #1201 | Icon Request: Weight | - | ||
โ | #1203 | Icon request: Megaphone | - | ||
โ | #1217 | Icon request: Add Bookmark & Remove Bookmark | - | ||
โ | #1218 | Icon request: Eclipse or half brightness | - | ||
โ | #1220 | Icon request: scan icon for QR Code scan | - |
Updated 3th of Nov 2023
To be able to preview icons as they will appear on the site
It's a bit unconvenient to download a PNG icon without being able to choose its color, you have to manually recolor the picture afterwards.
Please add a color picker, to change the color of the downloadable PNGs.
According to thread in #68 the output of the icon-font is not matching the quality of the svgs.
Download artifact from this link.
Open the html file
Icons need to be the same as the svgs
According to the fontcustom documentation we are not matching the SVG Guidelines.
Possible solution is converting the svgs stroke paths to outline paths before we build a font file.
I found this library outline-stroke transform paths, maybe we can use this for the solution.
Hi there!
First of all, thank you a lot for the initiative to, somehow, moving forward the Feather project. I really hope the effort and result can convince @colebemis about his concerns and see both project meet in the near future.
That said, my request is an icon for the "Screen sharing" action in a video conferencing software. Back in April, I was trying to do it but my lack of design / SVG / Figma knowledge didn't allow me to make something presentable. Even after spending quite some hours! Quite frustrating :)
However, just in case it could be helpful, I can tell you that I don't like too much the one included in the Material Design icons. Maybe, something similar to https://thenounproject.com/search/?q=screen%20share&i=2012801 or https://thenounproject.com/tomekpst/collection/basic-icons/?i=2012799 but based the Feather/monitor could look nice.
On the other hand, using the Feather/wifi or Feather/rss icon as part of it instead of the arrow could be confusing because it seems to be more appropriate for an "screen-casting" action, isn't it?
What do you think? Could it be possible to have feather-style icons for start / stop sharing the screen?
Thanks in advance.
We currently have a tags.json file in the root, containing tags for each icons.
This to improve searching on the site.
The problem with adding new icons is that we often forget to update this file.
So I thought maybe we can define it also in the svg file, when opening new PRs we can submit suggestions on the svgIcon.
<svg
width="24"
height="24"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
tags="read, dictionary, booklet, magazine, library"
>
...
</svg>
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.