[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-10118":3},{"id":4,"name":5,"fullName":6,"owner":5,"repo":5,"description":7,"homepage":8,"htmlUrl":9,"language":10,"languages":9,"totalLinesOfCode":9,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":16,"stars7d":17,"stars30d":18,"stars90d":15,"forks30d":15,"starsTrendScore":19,"compositeScore":20,"rankGlobal":9,"rankLanguage":9,"license":21,"archived":22,"fork":22,"defaultBranch":23,"hasWiki":24,"hasPages":24,"topics":25,"createdAt":9,"pushedAt":9,"updatedAt":29,"readmeContent":30,"aiSummary":31,"trendingCount":15,"starSnapshotCount":15,"syncStatus":32,"lastSyncTime":33,"discoverSource":34},10118,"react-icons","react-icons\u002Freact-icons","svg react icons of popular icon packs","https:\u002F\u002Freact-icons.github.io\u002Freact-icons\u002F",null,"TypeScript",12592,806,49,193,0,4,6,25,12,82.22,"Other",false,"master",true,[26,27,28],"icons","react","svg-icons","2026-06-12 04:00:48","\u003Cimg src=\"https:\u002F\u002Fraw.githubusercontent.com\u002Freact-icons\u002Freact-icons\u002Fmaster\u002Freact-icons.svg\" width=\"120\" alt=\"React Icons\">\n\n# [React Icons](https:\u002F\u002Freact-icons.github.io\u002Freact-icons)\n\n[![npm][npm-image]][npm-url]\n\n[npm-image]: https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002Freact-icons.svg?style=flat-square\n[npm-url]: https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Freact-icons\n\nInclude popular icons in your React projects easily with `react-icons`, which utilizes ES6 imports that allows you to include only the icons that your project is using.\n\n## Installation (for standard modern project)\n\n```bash\nyarn add react-icons\n# or\nnpm install react-icons --save\n```\n\nexample usage\n\n```jsx\nimport { FaBeer } from \"react-icons\u002Ffa\";\n\nfunction Question() {\n  return (\n    \u003Ch3>\n      Lets go for a \u003CFaBeer \u002F>?\n    \u003C\u002Fh3>\n  );\n}\n```\n\n[View the documentation](https:\u002F\u002Freact-icons.github.io\u002Freact-icons) for further usage examples and how to use icons from other packages. _NOTE_: each Icon package has it's own subfolder under `react-icons` you import from.\n\nFor example, to use an icon from **Material Design**, your import would be: `import { ICON_NAME } from 'react-icons\u002Fmd';`\n\n## Installation (for meteorjs, gatsbyjs, etc)\n\n> **Note**\n> This option has not had a new release for some time.\n> More info https:\u002F\u002Fgithub.com\u002Freact-icons\u002Freact-icons\u002Fissues\u002F593\n\nIf your project grows in size, this option is available.\nThis method has the trade-off that it takes a long time to install the package.\n\n```bash\nyarn add @react-icons\u002Fall-files\n# or\nnpm install @react-icons\u002Fall-files --save\n```\n\nexample usage\n\n```jsx\nimport { FaBeer } from \"@react-icons\u002Fall-files\u002Ffa\u002FFaBeer\";\n\nfunction Question() {\n  return (\n    \u003Ch3>\n      Lets go for a \u003CFaBeer \u002F>?\n    \u003C\u002Fh3>\n  );\n}\n```\n\n## Icons\n\n| Icon Library                                                            | License                                                                                           | Version                                  | Count |\n| ----------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ---------------------------------------- | ----: |\n| [Circum Icons](https:\u002F\u002Fcircumicons.com\u002F)                                | [MPL-2.0 license](https:\u002F\u002Fgithub.com\u002FKlarr-Agency\u002FCircum-Icons\u002Fblob\u002Fmain\u002FLICENSE)                 | 1.0.0                                    |   288 |\n| [Font Awesome 5](https:\u002F\u002Ffontawesome.com\u002F)                              | [CC BY 4.0 License](https:\u002F\u002Fcreativecommons.org\u002Flicenses\u002Fby\u002F4.0\u002F)                                 | 5.15.4-3-gafecf2a                        |  1612 |\n| [Font Awesome 6](https:\u002F\u002Ffontawesome.com\u002F)                              | [CC BY 4.0 License](https:\u002F\u002Fcreativecommons.org\u002Flicenses\u002Fby\u002F4.0\u002F)                                 | 6.5.2                                    |  2045 |\n| [Ionicons 4](https:\u002F\u002Fionicons.com\u002F)                                     | [MIT](https:\u002F\u002Fgithub.com\u002Fionic-team\u002Fionicons\u002Fblob\u002Fmaster\u002FLICENSE)                                 | 4.6.3                                    |   696 |\n| [Ionicons 5](https:\u002F\u002Fionicons.com\u002F)                                     | [MIT](https:\u002F\u002Fgithub.com\u002Fionic-team\u002Fionicons\u002Fblob\u002Fmaster\u002FLICENSE)                                 | 5.5.4                                    |  1332 |\n| [Material Design icons](http:\u002F\u002Fgoogle.github.io\u002Fmaterial-design-icons\u002F) | [Apache License Version 2.0](https:\u002F\u002Fgithub.com\u002Fgoogle\u002Fmaterial-design-icons\u002Fblob\u002Fmaster\u002FLICENSE) | 4.0.0-98-g9beae745bb                     |  4341 |\n| [Typicons](http:\u002F\u002Fs-ings.com\u002Ftypicons\u002F)                                 | [CC BY-SA 3.0](https:\u002F\u002Fcreativecommons.org\u002Flicenses\u002Fby-sa\u002F3.0\u002F)                                   | 2.1.2                                    |   336 |\n| [Github Octicons icons](https:\u002F\u002Focticons.github.com\u002F)                   | [MIT](https:\u002F\u002Fgithub.com\u002Fprimer\u002Focticons\u002Fblob\u002Fmaster\u002FLICENSE)                                     | 18.3.0                                   |   264 |\n| [Feather](https:\u002F\u002Ffeathericons.com\u002F)                                    | [MIT](https:\u002F\u002Fgithub.com\u002Ffeathericons\u002Ffeather\u002Fblob\u002Fmaster\u002FLICENSE)                                | 4.29.1                                   |   287 |\n| [Lucide](https:\u002F\u002Flucide.dev\u002F)                                           | [ISC](https:\u002F\u002Fgithub.com\u002Flucide-icons\u002Flucide\u002Fblob\u002Fmain\u002FLICENSE)                                   | v5.1.0-6-g438f572e                       |  1215 |\n| [Game Icons](https:\u002F\u002Fgame-icons.net\u002F)                                   | [CC BY 3.0](https:\u002F\u002Fcreativecommons.org\u002Flicenses\u002Fby\u002F3.0\u002F)                                         | 12920d6565588f0512542a3cb0cdfd36a497f910 |  4040 |\n| [Weather Icons](https:\u002F\u002Ferikflowers.github.io\u002Fweather-icons\u002F)           | [SIL OFL 1.1](http:\u002F\u002Fscripts.sil.org\u002FOFL)                                                         | 2.0.12                                   |   219 |\n| [Devicons](https:\u002F\u002Fvorillaz.github.io\u002Fdevicons\u002F)                        | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 1.8.0                                    |   192 |\n| [Ant Design Icons](https:\u002F\u002Fgithub.com\u002Fant-design\u002Fant-design-icons)      | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 4.4.2                                    |   831 |\n| [Bootstrap Icons](https:\u002F\u002Fgithub.com\u002Ftwbs\u002Ficons)                        | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 1.11.3                                   |  2716 |\n| [Remix Icon](https:\u002F\u002Fgithub.com\u002FRemix-Design\u002FRemixIcon)                 | [Apache License Version 2.0](http:\u002F\u002Fwww.apache.org\u002Flicenses\u002F)                                     | 4.2.0                                    |  2860 |\n| [Flat Color Icons](https:\u002F\u002Fgithub.com\u002Ficons8\u002Fflat-color-icons)          | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 1.0.2                                    |   329 |\n| [Grommet-Icons](https:\u002F\u002Fgithub.com\u002Fgrommet\u002Fgrommet-icons)               | [Apache License Version 2.0](http:\u002F\u002Fwww.apache.org\u002Flicenses\u002F)                                     | 4.12.1                                   |   635 |\n| [Heroicons](https:\u002F\u002Fgithub.com\u002Ftailwindlabs\u002Fheroicons)                  | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 1.0.6                                    |   460 |\n| [Heroicons 2](https:\u002F\u002Fgithub.com\u002Ftailwindlabs\u002Fheroicons)                | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 2.1.3                                    |   888 |\n| [Simple Icons](https:\u002F\u002Fsimpleicons.org\u002F)                                | [CC0 1.0 Universal](https:\u002F\u002Fcreativecommons.org\u002Fpublicdomain\u002Fzero\u002F1.0\u002F)                           | 12.14.0                                  |  3209 |\n| [Simple Line Icons](https:\u002F\u002Fthesabbir.github.io\u002Fsimple-line-icons\u002F)     | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 2.5.5                                    |   189 |\n| [IcoMoon Free](https:\u002F\u002Fgithub.com\u002FKeyamoon\u002FIcoMoon-Free)                | [CC BY 4.0 License](https:\u002F\u002Fgithub.com\u002FKeyamoon\u002FIcoMoon-Free\u002Fblob\u002Fmaster\u002FLicense.txt)             | d006795ede82361e1bac1ee76f215cf1dc51e4ca |   491 |\n| [BoxIcons](https:\u002F\u002Fgithub.com\u002Fatisawd\u002Fboxicons)                         | [MIT](https:\u002F\u002Fgithub.com\u002Fatisawd\u002Fboxicons\u002Fblob\u002Fmaster\u002FLICENSE)                                    | 2.1.4                                    |  1634 |\n| [css.gg](https:\u002F\u002Fgithub.com\u002Fastrit\u002Fcss.gg)                              | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 2.1.1                                    |   704 |\n| [VS Code Icons](https:\u002F\u002Fgithub.com\u002Fmicrosoft\u002Fvscode-codicons)           | [CC BY 4.0](https:\u002F\u002Fcreativecommons.org\u002Flicenses\u002Fby\u002F4.0\u002F)                                         | 0.0.35                                   |   461 |\n| [Tabler Icons](https:\u002F\u002Fgithub.com\u002Ftabler\u002Ftabler-icons)                  | [MIT](https:\u002F\u002Fopensource.org\u002Flicenses\u002FMIT)                                                        | 3.2.0                                    |  5237 |\n| [Themify Icons](https:\u002F\u002Fgithub.com\u002Flykmapipo\u002Fthemify-icons)             | [MIT](https:\u002F\u002Fgithub.com\u002Fthecreation\u002Fstandard-icons\u002Fblob\u002Fmaster\u002Fmodules\u002Fthemify-icons\u002FLICENSE)    | v0.1.2-2-g9600186                        |   352 |\n| [Radix Icons](https:\u002F\u002Ficons.radix-ui.com)                               | [MIT](https:\u002F\u002Fgithub.com\u002Fradix-ui\u002Ficons\u002Fblob\u002Fmaster\u002FLICENSE)                                      | @radix-ui\u002Freact-icons@1.3.0-1-g94b3fcf   |   318 |\n| [Phosphor Icons](https:\u002F\u002Fgithub.com\u002Fphosphor-icons\u002Fcore)                | [MIT](https:\u002F\u002Fgithub.com\u002Fphosphor-icons\u002Fcore\u002Fblob\u002Fmain\u002FLICENSE)                                   | 2.1.1                                    |  9072 |\n| [Icons8 Line Awesome](https:\u002F\u002Ficons8.com\u002Fline-awesome)                  | [MIT](https:\u002F\u002Fgithub.com\u002Ficons8\u002Fline-awesome\u002Fblob\u002Fmaster\u002FLICENSE.md)                              | 1.3.1                                    |  1544 |\n\nYou can add more icons by submitting pull requests or creating issues.\n\n## Configuration\n\nYou can configure react-icons props using [React Context API](https:\u002F\u002Freactjs.org\u002Fdocs\u002Fcontext.html).\n\n_Requires **React 16.3** or higher._\n\n```jsx\nimport { IconContext } from \"react-icons\";\n\n\u003CIconContext.Provider value={{ color: \"blue\", className: \"global-class-name\" }}>\n  \u003Cdiv>\n    \u003CFaFolder \u002F>\n  \u003C\u002Fdiv>\n\u003C\u002FIconContext.Provider>;\n```\n\n| Key         | Default               | Notes                              |\n| ----------- | --------------------- | ---------------------------------- |\n| `color`     | `undefined` (inherit) |                                    |\n| `size`      | `1em`                 |                                    |\n| `className` | `undefined`           |                                    |\n| `style`     | `undefined`           | Can overwrite size and color       |\n| `attr`      | `undefined`           | Overwritten by other attributes    |\n| `title`     | `undefined`           | Icon description for accessibility |\n\n## Migrating from version 2 -> 3\n\n### Change import style\n\nImport path has changed. You need to rewrite from the old style.\n\n```jsx\n\u002F\u002F OLD IMPORT STYLE\nimport FaBeer from \"react-icons\u002Flib\u002Ffa\u002Fbeer\";\n\nfunction Question() {\n  return (\n    \u003Ch3>\n      Lets go for a \u003CFaBeer \u002F>?\n    \u003C\u002Fh3>\n  );\n}\n```\n\n```jsx\n\u002F\u002F NEW IMPORT STYLE\nimport { FaBeer } from \"react-icons\u002Ffa\";\n\nfunction Question() {\n  return (\n    \u003Ch3>\n      Lets go for a \u003CFaBeer \u002F>?\n    \u003C\u002Fh3>\n  );\n}\n```\n\nEnding up with a large JS bundle? Check out [this issue](https:\u002F\u002Fgithub.com\u002Freact-icons\u002Freact-icons\u002Fissues\u002F154).\n\n### Adjustment CSS\n\nFrom version 3, `vertical-align: middle` is not automatically given. Please use IconContext to specify className or specify an inline style.\n\n#### Global Inline Styling\n\n```tsx\n\u003CIconContext.Provider value={{ style: { verticalAlign: 'middle' } }}>\n```\n\n#### Global `className` Styling\n\nComponent\n\n```tsx\n\u003CIconContext.Provider value={{ className: 'react-icons' }}>\n```\n\nCSS\n\n```css\n.react-icons {\n  vertical-align: middle;\n}\n```\n\n### TypeScript native support\n\nDependencies on `@types\u002Freact-icons` can be deleted.\n\n#### Yarn\n\n```bash\nyarn remove @types\u002Freact-icons\n```\n\n#### NPM\n\n```bash\nnpm remove @types\u002Freact-icons\n```\n\n## Contributing\n\n`.\u002Fbuild-script.sh` will build the whole project. See also CI scripts for more information.\n\n### Development\n\n```bash\nyarn\ncd packages\u002Freact-icons\nyarn fetch  # fetch icon sources\nyarn build\n```\n\n### Add\u002FUpdate icon set\n\nFirst, check the discussion to see if anyone would like to add an icon set.\n\nhttps:\u002F\u002Fgithub.com\u002Freact-icons\u002Freact-icons\u002Fdiscussions\u002Fcategories\u002Fnew-icon-set\n\nThe SVG files to be fetched are managed in this file. Edit this file and run `yarn fetch && yarn check && yarn build`.\n\nhttps:\u002F\u002Fgithub.com\u002Freact-icons\u002Freact-icons\u002Fblob\u002Fmaster\u002Fpackages\u002Freact-icons\u002Fsrc\u002Ficons\u002Findex.ts\n\n### Preview\n\n> **Note**\n> The project is not actively accepting PR for the preview site at this time.\n\nThe preview site is the [`react-icons`](https:\u002F\u002Freact-icons.github.io\u002Freact-icons\u002F) website, built in Astro+React.\n\n```bash\ncd packages\u002Freact-icons\nyarn fetch\nyarn build\n\ncd ..\u002Fpreview-astro\nyarn start\n```\n\n### Demo\n\nThe demo is a [Create React App](https:\u002F\u002Fcreate-react-app.dev\u002F) boilerplate with `react-icons` added as a dependency for easy testing.\n\n```bash\ncd packages\u002Freact-icons\nyarn fetch\nyarn build\n\ncd ..\u002Fdemo\nyarn start\n```\n\n## Why React SVG components instead of fonts?\n\nSVG is [supported by all major browsers](http:\u002F\u002Fcaniuse.com\u002F#search=svg). With `react-icons`, you can serve only the needed icons instead of one big font file to the users, helping you to recognize which icons are used in your project.\n\n## Related Projects\n\n- [react-svg-morph](https:\u002F\u002Fgithub.com\u002Fgorangajic\u002Freact-svg-morph\u002F)\n\n## Licence\n\nMIT\n\n- Icons are taken from the other projects so please check each project licences accordingly.\n","React Icons 是一个用于在React项目中轻松集成SVG图标的库。它支持多种流行的图标包，如Font Awesome、Material Design等，并通过ES6导入方式仅引入项目实际使用的图标，从而优化了应用的加载速度和性能。该库使用TypeScript编写，确保了类型安全。React Icons非常适合需要丰富视觉元素但又希望保持高效性能的应用场景，比如网站、仪表盘或是任何基于React构建的用户界面。",2,"2026-06-11 03:26:42","top_topic"]