{"id":13750825,"url":"https://github.com/iconify/icon-sets","last_synced_at":"2025-05-14T00:11:20.179Z","repository":{"id":37590149,"uuid":"154000256","full_name":"iconify/icon-sets","owner":"iconify","description":"150+ open source icon sets. Icons are validated, cleaned up, optimised, ready to render as SVG. Updated automatically 3 times a week.","archived":false,"fork":false,"pushed_at":"2025-05-07T06:13:42.000Z","size":578828,"stargazers_count":773,"open_issues_count":2,"forks_count":68,"subscribers_count":13,"default_branch":"master","last_synced_at":"2025-05-07T07:27:28.203Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://icon-sets.iconify.design/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/iconify.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"open_collective":"iconify","github":["cyberalien"]}},"created_at":"2018-10-21T11:19:50.000Z","updated_at":"2025-05-07T06:13:43.000Z","dependencies_parsed_at":"2024-02-07T17:54:50.019Z","dependency_job_id":"9221935e-0402-4272-b2b5-6408a90510ef","html_url":"https://github.com/iconify/icon-sets","commit_stats":{"total_commits":1121,"total_committers":3,"mean_commits":373.6666666666667,"dds":"0.016949152542372836","last_synced_commit":"416e8fce2ea1d832b1157c6714d0ca3dc8c6c1be"},"previous_names":["iconify/collections-json"],"tags_count":1150,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iconify%2Ficon-sets","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iconify%2Ficon-sets/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iconify%2Ficon-sets/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iconify%2Ficon-sets/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/iconify","download_url":"https://codeload.github.com/iconify/icon-sets/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254044413,"owners_count":22005155,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-03T08:00:54.516Z","updated_at":"2025-05-14T00:11:20.131Z","avatar_url":"https://github.com/iconify.png","language":"TypeScript","funding_links":["https://opencollective.com/iconify","https://github.com/sponsors/cyberalien"],"categories":["Collections","TypeScript"],"sub_categories":[],"readme":"# Iconify icon sets in JSON format\n\nThis is a big collection of open source vector icons, all validated, cleaned up and converted to the same easy to use format.\n\nEven though all icon sets are open source, some icon sets require attribution.\n\nSee [collections.md](./collections.md) for list of icon sets and their licenses.\n\n## Validation and clean up\n\nAll icons have been processed with [Iconify Tools](https://iconify.design/docs/libraries/tools/) to clean them up.\n\nIcon parsing process includes:\n\n- Very strict validation and clean up. Icons do not contain scripts, event listeners, fonts, raster images, external resources and unknown elements.\n- Colors for monotone icons have been replaced with `currentColor`, making it easy to change icon color by changing text color.\n- Icon content has been optimised to reduce its size.\n\n## Maintenance\n\nThis repository is automatically updated several times a week, so it always contains the latest icons for all icon sets.\n\n## Format\n\nIcon sets are stored in `IconifyJSON` format. TypeScript definition is available in `@iconify/types` package. Documentation is [available on Iconify Documentation website](https://iconify.design/docs/types/iconify-json.html).\n\nTo work with icon sets, use [Iconify Utils](https://iconify.design/docs/libraries/utils/). Utils package works in any JavaScript environment: Node.js, Deno, browsers, isolated JavaScript environments.\n\n## Usage\n\nThese icons can be used with many tools, plugins and components. They can also be exported as individual SVG files.\n\nSee [Iconify documentation](https://iconify.design/docs/usage/) for more details.\n\n## How to get this repository\n\nInstructions below are for Node.js and PHP projects.\n\n### Node.js\n\nRun this command to add icons to your project:\n\n```bash\nnpm install --save @iconify/json\n```\n\nIcons will be available in node_modules/@iconify/json\n\nTo resolve filename for any json file, use this if you are using CommonJS syntax:\n\n```js\nimport { locate } from '@iconify/json';\n\n// returns location of mdi-light.json\nconst mdiLightFilename = locate('mdi-light');\n```\n\n### PHP\n\nInstall and initialize Composer project. See documentation at [https://getcomposer.org](https://getcomposer.org)\n\nThen open composer.json and add following code:\n\n```json\n\"require\": {\n    \"php\": \"\u003e=5.6\",\n    \"iconify/json\": \"*\"\n}\n```\n\nthen run:\n\n```bash\ncomposer install\n```\n\nIcons will be available in vendor/iconify/json/\n\nIf you don't use Composer, clone GitHub repository and add necessary autoload code.\n\nTo resolve filename for any json file, use this:\n\n```php\n// Returns location of mdi-light.json\n$mdiLightLocation = \\Iconify\\IconsJSON\\Finder::locate('mdi-light');\n```\n\n## Data format\n\nIcons used by Iconify are in directory json, in Iconify JSON format.\n\nWhy JSON instead of SVG? There are several reasons for that:\n\n- Easy to store images in bulk.\n- Contains only content of icon without `\u003csvg\u003e` element, making it easy to manipulate content without doing complex parsing. It also makes it easier to create components, such as React icon component, allowing to use framework native SVG element.\n- Data can contain additional content: aliases for icons, icon set information, categories/tags/themes.\n\nWhy not XML?\n\n- JSON is much easier to parse without additional tools. All languages support it.\n\nFormat of json file is very simple:\n\n```json\n{\n  \"prefix\": \"mdi-light\",\n  \"icons\": {\n    \"icon-name\": {\n      \"body\": \"\u003cg /\u003e\",\n      \"width\": 24,\n      \"height\": 24\n    }\n  },\n  \"aliases\": {\n    \"icon-alias\": {\n      \"parent\": \"icon-name\"\n    }\n  }\n}\n```\n\n\"icons\" object contains list of all icons.\n\nEach icon has following properties:\n\n- body: icon body.\n- left, top: left and top coordinates of viewBox, default is 0.\n- width, height: dimensions of viewBox, default is 16.\n- rotate: rotation. Default = 0. Values: 0 = 0deg, 1 = 90deg, 2 = 180deg, 3 = 270deg.\n- hFlip: horizontal flip. Boolean value, default = false.\n- vFlip: vertical flip. Boolean value, default = false.\n- hidden: if set to true, icon is hidden. That means icon was removed from collection for some reason, but it is kept in JSON file to prevent applications that rely on old icon from breaking.\n\nOptional \"aliases\" object contains list of aliases for icons. Format is similar to \"icons\" object, but without \"body\" property and with additional property \"parent\" that points to parent icon. Transformation properties (rotate, hFlip, vFlip) are merged with parent icon's properties. Any other properties overwrite properties of parent icon.\n\nWhen multiple icons have the same value, it is moved to root object to reduce duplication:\n\n```json\n{\n  \"prefix\": \"mdi-light\",\n  \"icons\": {\n    \"icon1\": {\n      \"body\": \"\u003cg /\u003e\"\n    },\n    \"icon2\": {\n      \"body\": \"\u003cg /\u003e\"\n    },\n    \"icon-20\": {\n      \"body\": \"\u003cg /\u003e\",\n      \"width\": 20,\n      \"height\": 20\n    }\n  },\n  \"width\": 24,\n  \"height\": 24\n}\n```\n\nIn example above, \"icon1\" and \"icon2\" are 24x24, \"icon-20\" is 20x20.\n\nFor more information see developer documentation on [https://iconify.design/docs/types/iconify-json.html](https://docs.iconify.design/types/iconify-json.html)\n\n## Extracting individual SVG icons\n\nYou can use [Iconify Utils](https://iconify.design/docs/libraries/utils/) for simple export process or [Iconify Tools](https://iconify.design/docs/libraries/tools/) for more options.\n\nExample using Iconify Utils (TypeScript):\n\n```ts\nimport { promises as fs } from 'fs';\n\n// Function to locate JSON file\nimport { locate } from '@iconify/json';\n\n// Various functions from Iconify Utils\nimport { parseIconSet } from '@iconify/utils/lib/icon-set/parse';\nimport { iconToSVG } from '@iconify/utils/lib/svg/build';\nimport { defaults } from '@iconify/utils/lib/customisations';\n\n(async () =\u003e {\n  // Locate icons\n  const filename = locate('mdi');\n\n  // Load icon set\n  const icons = JSON.parse(await fs.readFile(filename, 'utf8'));\n\n  // Parse all icons\n  const exportedSVG: Record\u003cstring, string\u003e = Object.create(null);\n  parseIconSet(icons, (iconName, iconData) =\u003e {\n    if (!iconData) {\n      // Invalid icon\n      console.error(`Error parsing icon ${iconName}`);\n      return;\n    }\n\n    // Render icon\n    const renderData = iconToSVG(iconData, {\n      ...defaults,\n      height: 'auto',\n    });\n\n    // Generate attributes for SVG element\n    const svgAttributes: Record\u003cstring, string\u003e = {\n      'xmlns': 'http://www.w3.org/2000/svg',\n      'xmlns:xlink': 'http://www.w3.org/1999/xlink',\n      ...renderData.attributes,\n    };\n    const svgAttributesStr = Object.keys(svgAttributes)\n      .map(\n        (attr) =\u003e\n          // No need to check attributes for special characters, such as quotes,\n          // they cannot contain anything that needs escaping.\n          `${attr}=\"${svgAttributes[attr as keyof typeof svgAttributes]}\"`\n      )\n      .join(' ');\n\n    // Generate SVG\n    const svg = `\u003csvg ${svgAttributesStr}\u003e${renderData.body}\u003c/svg\u003e`;\n    exportedSVG[iconName] = svg;\n  });\n\n  // Output directory\n  const outputDir = 'mdi-export';\n  try {\n    await fs.mkdir(outputDir, {\n      recursive: true,\n    });\n  } catch (err) {\n    //\n  }\n\n  // Save all files\n  const filenames = Object.keys(exportedSVG);\n  for (let i = 0; i \u003c filenames.length; i++) {\n    const filename = filenames[i];\n    const svg = exportedSVG[filename];\n    await fs.writeFile(outputDir + '/' + filename + '.svg', svg, 'utf8');\n  }\n})();\n```\n\nSame example using Iconify Tools:\n\n```ts\nimport { readFile, writeFile, mkdir } from 'fs';\nimport { SVG } from '@iconify/tools';\n\nconst outputDir = 'mdi-export';\n\n// Create target directory\ntry {\n  await mkdir(outputDir, {\n    recursive: true,\n  });\n} catch (err) {\n  //\n}\n\n// Locate icons\nconst filename = locate('mdi');\n\n// Load icon set\nconst data = JSON.parse(await fs.readFile(filename, 'utf8'));\n\n// Create IconSet instance\nconst iconSet = new IconSet(data);\n\n// Export all icons\nawait iconSet.forEach(async (name) =\u003e {\n  const svg = iconSet.toString(name);\n  if (!svg) {\n    return;\n  }\n\n  // Save to file\n  await writeFile(`${outputDir}/${name}.svg`, svg, 'utf8');\n  console.log(`Saved ${outputDir}/${name}.svg (${svg.length} bytes)`);\n});\n```\n\nSee [Iconify Tools documentation](https://iconify.design/docs/libraries/tools/export/) for more export options.\n\n## License\n\nThis is collection of icon sets created by various authors.\n\nSee [collections.md](./collections.md) for list of icon sets and their licenses.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ficonify%2Ficon-sets","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ficonify%2Ficon-sets","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ficonify%2Ficon-sets/lists"}