iconoir-icons / iconoir Goto Github PK

Icon Request

• Icon name: QR Code
• Use case: Scan QR Code interaction
• Screenshots of similar icons:
  

Icon Request

• Icon name: Washing machine / washer
• Use case: Apartment Feature List for Rentals
• Screenshots of similar icons:
  

Prerequisites

• Version: 4.3.0
• Are you running from source/master: Yes
• Are you using a released build: Yes
• Operating system:

Step to reproduce

Try to change the color of any of the affected icons using CSS/the "color" prop of the react library icons.

Actual behavior

Part of the affected icons remains black despite changing the icon's color. (Attached image is only one example)

Additional info or screenshots

Icons using fill="black" are:

• icons\accessibility-tech.svg
• icons\accessibility.svg
• icons\bowling-ball.svg
• icons\box-iso.svg
• icons\cart-alt.svg
• icons\cart.svg
• icons\cloud-desync.svg
• icons\cloud-sync.svg
• icons\emoji-blink-left.svg
• icons\emoji-blink-right.svg
• icons\emoji-sad.svg
• icons\emoji.svg
• icons\mac-dock.svg
• icons\mouse-scroll-wheel.svg
• icons\no-credit-card.svg
• icons\page-search.svg
• icons\page-star.svg
• icons\people-rounded.svg

Icon Request

• Icon name: page-pen
• Use case: Edit some Text or fill input field
• Screenshots of similar icons: https://cdn3.iconfinder.com/data/icons/technology-internet-and-communication/100/technology_internet_communications13-512.png

As social media icons are often used in login/sign-up forms where Google is very often represented as a way to sign in, having one style to cover all of the different logos is super important!

Icon Request

• Icon name: Scan Barcode
• Use case: Shop App
• Screenshots of similar icons:

Icon Request

• Icon name: arrow with box
• Use case: login or logout
• Screenshots of similar icons:
  

Icon Request

• Icon name: science pack
• Use case: science related designs
• Screenshots of similar icons:

Hi!

Great work with these icons they look really good.

I wanted to add a humble suggestion for those who need a component and don't want to use react. I recently created a custom element to work with various icon libraries

https://github.com/lekoala/last-icon

Just added the support for your icon set :-)

Keep up the good work!

Github, Gitlab icons fail to download as PNG. Please check this out.

Prerequisites

• Version: 4.2.2
• Are you running from source/master: Yes
• Are you using a released build: Yes

Issue

Trying to change the color of any of the icons that have stroke="black" in them with css won't work as the stroke setting overwrites any styles you try and apply to the icon. To change the color you'd have to manually edit the files.

Additional info or screenshots

The following is a list of all icons that have stroke="black" in them:

• icons\1st-medal.svg
• icons\accessibility-sign.svg
• icons\accessibility-tech.svg
• icons\accessibility.svg
• icons\add-database-script.svg
• icons\add-frame.svg
• icons\airplane-helix-45deg.svg
• icons\airplane-helix.svg
• icons\airplane-rotation.svg
• icons\antenna-signal-rounded.svg
• icons\app-notification.svg
• icons\apple-imac-2021-side.svg
• icons\apple-imac-2021.svg
• icons\apple-swift.svg
• icons\ar-symbol.svg
• icons\basketball-field.svg
• icons\bell-notification.svg
• icons\bluetooth-rounded.svg
• icons\bowling-ball.svg
• icons\box-iso.svg
• icons\boxing-glove.svg
• icons\cable-rounded.svg
• icons\codepen.svg
• icons\control-slider.svg
• icons\cycling.svg
• icons\database-backup.svg
• icons\database-export.svg
• icons\database-monitor.svg
• icons\database-restore.svg
• icons\database-rounded.svg
• icons\database-script.svg
• icons\database-settings.svg
• icons\database-stats.svg
• icons\design-pencil.svg
• icons\drag-hand-gesture.svg
• icons\dribbble.svg
• icons\euro-square.svg
• icons\ev-charge-alt.svg
• icons\ev-charge.svg
• icons\ev-plug-charging.svg
• icons\ev-plug-error.svg
• icons\ev-plug.svg
• icons\ev-rounded.svg
• icons\ev-station.svg
• icons\face-id.svg
• icons\farm.svg
• icons\filter-alt.svg
• icons\finder.svg
• icons\Fishing.svg
• icons\flower.svg
• icons\frame-select.svg
• icons\frame-simple.svg
• icons\frame.svg
• icons\fx-rounded.svg
• icons\fx.svg
• icons\garage.svg
• icons\gas-tank-drop.svg
• icons\gas-tank.svg
• icons\hand-brake.svg
• icons\hat.svg
• icons\hexagon-alt.svg
• icons\high-priority.svg
• icons\home-simple-door.svg
• icons\home-simple.svg
• icons\hospital.svg
• icons\industry.svg
• icons\ios-settings.svg
• icons\leaderboard-star.svg
• icons\leaderboard.svg
• icons\load-action-floppy.svg
• icons\lock-key.svg
• icons\mac-control-key.svg
• icons\mac-option-key.svg
• icons\mac-os-window.svg
• icons\map-issue.svg
• icons\maps-arrow-issue.svg
• icons\maps-go-straight.svg
• icons\maps-turn-back.svg
• icons\maps-turn-left.svg
• icons\maps-turn-right.svg
• icons\medal.svg
• icons\megaphone.svg
• icons\mouse-button-left.svg
• icons\mouse-button-right.svg
• icons\multi-mac-os-window.svg
• icons\multi-window.svg
• icons\off-rounded.svg
• icons\oil-industry.svg
• icons\on-rounded.svg
• icons\one-finger-select-hand-gesture.svg
• icons\open-in-browser.svg
• icons\open-in-window.svg
• icons\open-select-hand-gesture.svg
• icons\pc-mouse.svg
• icons\pen-connect-bluetooth.svg
• icons\pen-connect-wifi.svg
• icons\pen-tablet-connect-usb.svg
• icons\pen-tablet-connect-wifi.svg
• icons\pen-tablet.svg
• icons\people-rounded.svg
• icons\pocket.svg
• icons\priority-down.svg
• icons\priority-up.svg
• icons\receive-dollars.svg
• icons\receive-euros.svg
• icons\receive-pounds.svg
• icons\receive-yens.svg
• icons\reminder-hand-gesture.svg
• icons\remove-database-script.svg
• icons\remove-frame.svg
• icons\reports.svg
• icons\running.svg
• icons\save-action-floppy.svg
• icons\save-floppy-disk.svg
• icons\scale-frame-enlarge.svg
• icons\scale-frame-reduce.svg
• icons\scale-frame.svg
• icons\send-dollars.svg
• icons\send-euros.svg
• icons\send-pounds.svg
• icons\send-yens.svg
• icons\settings-cloud.svg
• icons\settings-profiles.svg
• icons\single-tap-gesture.svg
• icons\skateboard.svg
• icons\skateboarding.svg
• icons\spock-hand-gesture.svg
• icons\stretching.svg
• icons\style-border.svg
• icons\swipe-down-gesture.svg
• icons\swipe-left-gesture.svg
• icons\swipe-right-gesture.svg
• icons\swipe-two-fingers-down-gesture.svg
• icons\swipe-two-fingers-left-gesture.svg
• icons\swipe-two-fingers-right-gesture.svg
• icons\swipe-two-fingers-up-gesture.svg
• icons\swipe-up-gesture.svg
• icons\system-restart.svg
• icons\system-shut.svg
• icons\terminal-simple.svg
• icons\treadmill.svg
• icons\trekking.svg
• icons\trophy.svg
• icons\tunnel.svg
• icons\twitter-verified-badge.svg
• icons\verified-badge.svg
• icons\verified-user.svg
• icons\view-columns-3.svg
• icons\vr-symbol.svg
• icons\waist.svg
• icons\walking.svg
• icons\web-window-close.svg
• icons\web-window-energy-consumption.svg
• icons\web-window.svg
• icons\wifi-rounded.svg
• icons\yen-square.svg
• icons\yoga.svg

If there are few different types of reset icons.

Here are a few use cases:

• Reset to start again (Similar to Photoshop preset etc)
• Re-Start (Reboot or actual hard reset with POWER)
• Start-again, possibly start with a blank screen again

thank you,

I would like to see a few different pipe icons (in various configurations). Straight vertical pipe. Straight horizontal pipe. and 'S'/'Z' shaped pipes. This would be useful for showing pipeline operations and for various other uses. Thanks!

Upvote & Fund

• We're using Polar.sh so you can upvote and help fund this issue.
• We receive the funding once the issue is completed & confirmed by you.
• Thank you in advance for helping prioritize & fund our backlog.

The current IconJar library file does not contain new icons, which are added periodically. It would be nice to update the library file along with the release of new icons.

Icon Request

• Icon name: Piggy bank
• Use case: Save money in general, discounted prices in e-commerce
• Screenshots of similar icons:
  

Hi! I saw that the only icon for social networks on the platform is Instagram. What about Facebook, Twitter, Linkedin, Youtube, Pinterest, Flickr, etc??

Icon Request

• Icon name: Air conditioner
• Use case: Apartment Feature List for Rentals
• Screenshots of similar icons:
  

Icon Request

• Icon name: no-smoking-circled
• Use case: Addition to "no-smoking" icon
• Screenshots of similar icons: https://static.thenounproject.com/png/952941-200.png

Icon Request

• Icon name: hd-symbol
• Use case: Same as 4k-display
• Screenshots of similar icons: http://simpleicon.com/wp-content/uploads/hd.png

A simple set of battery icons:

Full
75%
50%
25%
Empty
Charging

A basic image icon is very much needed.

Icon Request

• Icon name: wallet
• Use case: for use in cryptocurrency applications, and any e-commerce platforms
• Screenshots of similar icons:
  

Volume indicators, stuff like mute/unmute, a headphone icon and a speaker icon.

Great icons btw, they fit well with soft stuff, rounded corners n such

Prerequisites

Step to reproduce

Visit website
Search for "cart"
See two carts

Actual behavior

Additional info or screenshots

Prerequisites

• Version: 4.3.1
• Are you running from source/master: y
• Are you using a released build: probably
• Operating system: macOS 11.4
• Bits:

Step to reproduce

Step 1: Use React Native
Step 2: Try to use the package:

import { Iconoir } from 'iconoir-react-native';
/* ... */
<Iconoir color={'black'} height={25} width={25} />

Step 3: Fail miserably :(

Actual behavior

see screenshot below...

Any message or error

see screenshot below...

Additional info or screenshots

I'm not sure if it's the devDependencies, because it looked like they were not installed, so I manually installed them, but I still can't get the package working... Also my project is free of Typescript code maybe that could be the root of all of this?

Is your feature request related to a problem? Please describe.

Currently there is no package to use those beautiful icons, the only is to either put them inside the project by hand (annoying) or use the css link (huge)

Describe the solution you'd like

Same as the React package but with much less work to do. Just create a package with all the svg-s like the heroicons package does

Describe alternatives you've considered

either put them inside the project by hand (annoying) or use the css link (huge)

Additional context

None

React native doesn't support normal svg elements. Instead they have to be imported from react-native-svg compatibility layer for ios, android and web. SVGR supports it by simply passing the native flag.

Happy to contribute if it's something you would like to support ✌️

{
  "native": true,
  "typescript": true,
  "expandProps": "end",
}

Icon Request

• Icon name: BBQ
• Use case: Apartment Feature List for Rentals
• Screenshots of similar icons:
  

Please add Github, Gitlab, etc. icons!

Icon Request

• Icon name: Parking
• Use case: Apartment Feature List for Rentals
• Screenshots of similar icons:
  

Here you go!

iconoir 4.2.iconjar.zip

It would be nice to have a SVG Sprite.

@paescuj @PianoManDanDan What about having the NPM version aligned with the version here on GitHub? See for ref feathericons/feather

Unfortunately, I don't know how to include the font file so that I can use the given example:

<span class="iconoir-hand-brake"></span>

in my HTML file?

Version: 4.3.0
Are you running from source/master: Website
Are you using a released build: N/A
Operating system: N/A
Bits: N/A

How it looks now

How it should look

You only see the upper eye lid when eyes are closed, which is why it should be rotated 180deg.

Other than that, it's a STELLAR icon lib. Well done.

Yep, another social media icon, brilliant. A Snapchat icon would allow me to complete the suite of social media links for a site I'm designing with only Iconoir icons.

Thanks for taking time to make these icons!

The title says it all. For example, instead of edit-2, consider renaming the icon to edit-underlined.

Insead of albums-1 and album-2, consider renaming the album-1 to something like albums-layered and album-2 to something like albums-line.

Numbered icon names are difficult to remember, forcing you to keep visiting documentation to remember which one was which. As an example, see Material Design Icons for ideas for alternative-icon naming conventions. They have a consistent naming convention for alternatives.

Icon Request

• Icon name: bank icon
• Screenshots of similar icons: https://www.mcicon.com/product/bank-icon-13/

A lot of icons present in the Figma File in the community does not scale properly. When inspecting further we found out constraints of many icons are marked as Left Horizontally and Top Vertically where they should be marked to Scale both horizontally and vertically.

Step to reproduce

Try to resize icons, icons mainly in Actions, Audio, Food, Gestures, Maps, Other, Transport will distort.

Actual behavior

Icons should have scaled properly just like other icons

Additional info or screenshots

• Icon name: Media
• Use case: To represent "media". The camera icon is somewhat appropriate for photos, but not so much for non-camera-generated images. The media icon is ambiguous enough to represent both.
• Screenshots of similar icons:

Was going to make a PR, but see you're not accepting them at the moment. I'll attach it here in case you find it useful.

media.svg.zip

I am using fonts into my css - copy and paste the code you share for font - is there any iconoir.css like font-awesome.css which is included ::before content:"\abcs" like that???
Icons are awesome, It will popular in some time, but you need to add fonts css first to make it complete usable
Pls help

Thanks!

Icon Request

• Icon name: sidebar-expand, sidebar-collapse
• Use case: UI with a sidebar
• Screenshots of similar icons:
  https://icon-icons.com/icon/sidebar-expand-toggle-nav/145935
  https://icon-icons.com/icon/sidebar-collapse-toggle-nav/145936

Icon Request

• Icon name: windows, linux, macos
• Use case: Commonly used in websites of desktop apps
• Screenshots of similar icons:
  
  
  

Upvote & Fund

• We're using Polar.sh so you can upvote and help fund this issue.
• We receive the funding once the issue is completed & confirmed by you.
• Thank you in advance for helping prioritize & fund our backlog.

As discussed in this PR, we want to have a custom index file for svgr to use for generating nicer types that can be used in Typescript.

Describe the solution you'd like to have
A custom index.js file that svgr uses to generate the files in ~/packages/iconoir-react/src/.

OS Icons

Hi,

These icons try to resolve issues #24, requesting windows, apple and Linux icons.
I tried and made the following, even if not convinced for the Linux one.

• Windows and apple icon
  
• I also tried to make a Linux icon, but this is quite hard, let me know what you think of this one ...
  

Here is the link to the SVG icons:
https://we.tl/t-lofGWzxnLp

I used wetransfer so it will expire in 7 days.

Thanks,
A.

Icon Request

• Icon name: Barcode
• Use case: Shop App
• Screenshots of similar icons: