{"id":29022040,"url":"https://github.com/jsweb/material-icons-base64","last_synced_at":"2025-06-26T02:37:39.454Z","repository":{"id":40708451,"uuid":"230465546","full_name":"jsweb/material-icons-base64","owner":"jsweb","description":"Material Icons compiled with base64 embedded font to CSS instead of link to font files.","archived":false,"fork":false,"pushed_at":"2022-08-16T14:23:47.000Z","size":469,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-17T01:19:09.853Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jsweb.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-12-27T15:17:20.000Z","updated_at":"2022-07-30T17:03:25.000Z","dependencies_parsed_at":"2022-07-29T03:18:02.572Z","dependency_job_id":null,"html_url":"https://github.com/jsweb/material-icons-base64","commit_stats":null,"previous_names":[],"tags_count":33,"template":false,"template_full_name":null,"purl":"pkg:github/jsweb/material-icons-base64","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jsweb%2Fmaterial-icons-base64","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jsweb%2Fmaterial-icons-base64/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jsweb%2Fmaterial-icons-base64/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jsweb%2Fmaterial-icons-base64/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jsweb","download_url":"https://codeload.github.com/jsweb/material-icons-base64/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jsweb%2Fmaterial-icons-base64/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260326958,"owners_count":22992412,"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":"2025-06-26T02:37:35.621Z","updated_at":"2025-06-26T02:37:39.421Z","avatar_url":"https://github.com/jsweb.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @jsweb/material-icons-base64 ![NPM Package](https://github.com/jsweb/material-icons-base64/workflows/NPM%20Package/badge.svg)\n\nMaterial Icons compiled with WOFF2 base64 embedded fonts to CSS instead of link to font files.\n\n## About\n\nThis compilation uses original files from Google Fonts and a little magic through a custom build using PostCSS to embed the font file in CSS as base64 string.\n\nOnly WOFF2 fonts are included to minify the compiled CSS at most as possible, and because WOFF2 is supported by all modern major browsers.\n\nWeb projects are the target. Especially mobile web view apps and PWA with offline capabilities, caching the CSS icons lib easily.\n\nIE compatibility is not a concern (it is dead, accept it). For a compatibility reference see the link:\n\n[Can I use - WOFF2](http://caniuse.com/#search=woff2)\n\n## Install\n\n### NPM\n\n`npm i -S @jsweb/material-icons-base64`\n\n### Yarn\n\n`yarn add @jsweb/material-icons-base64`\n\n### PNPM\n\n`pnpm add @jsweb/material-icons-base64`\n\n## Usage\n\nCSS compilations in this package:\n\n- `md-icons.css`, class `material-icons`, for Material Icons Filled (169 KB)\n- `md-icons-outlined.css`, class `material-icons-outlined`, for Material Icons Outlined (203 KB)\n- `md-symbols-outlined.css`, class `material-symbols-outlined`, for Material Symbols Oulined (266 KB)\n- `md-symbols-rounded.css`, class `material-symbols-rounded`, for Material Symbols Rounded (305 KB)\n\nIf you are using a build tool for CSS compilation, just import the file you want in your CSS, like this:\n\n```css\n@import '@jsweb/material-icons-base64/md-icons.css';\n```\n\nIf you prefer to link the files from the CDN source, you can do it like this:\n\n```html\n\u003clink\n  rel=\"stylesheet\"\n  href=\"https://unpkg.com/@jsweb/material-icons-base64/md-symbols-outlined.css\"\n/\u003e\n```\n\nSo, just code your icon tags like this:\n\n```html\n\u003cspan class=\"material-icons\"\u003ehome\u003c/span\u003e\n\u003cspan class=\"material-symbols-outlined\"\u003ehome\u003c/span\u003e\n```\n\n## Icons\n\nYou can check the icons at Google Fonts index:\n\n- [Material Icons](https://fonts.google.com/icons?icon.set=Material+Icons)\n- [Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjsweb%2Fmaterial-icons-base64","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjsweb%2Fmaterial-icons-base64","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjsweb%2Fmaterial-icons-base64/lists"}