{"id":13846815,"url":"https://github.com/egmaleta/qwik-feather-icons","last_synced_at":"2025-07-12T07:33:08.910Z","repository":{"id":62974280,"uuid":"559537962","full_name":"egmaleta/qwik-feather-icons","owner":"egmaleta","description":"Feather icons for Qwik, the Resumable Framework","archived":false,"fork":false,"pushed_at":"2023-04-01T15:03:30.000Z","size":214,"stargazers_count":5,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-17T09:47:45.290Z","etag":null,"topics":["feather-icons","icons","qwik","qwik-framework","svg","svg-icons","ui-components"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/egmaleta.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,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2022-10-30T12:38:09.000Z","updated_at":"2024-02-12T23:19:00.000Z","dependencies_parsed_at":"2024-04-12T18:47:46.309Z","dependency_job_id":"43074462-4c3f-41f5-b89a-2c2a804b91fd","html_url":"https://github.com/egmaleta/qwik-feather-icons","commit_stats":null,"previous_names":["yeyon/qwik-feather-icons"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/egmaleta/qwik-feather-icons","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/egmaleta%2Fqwik-feather-icons","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/egmaleta%2Fqwik-feather-icons/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/egmaleta%2Fqwik-feather-icons/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/egmaleta%2Fqwik-feather-icons/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/egmaleta","download_url":"https://codeload.github.com/egmaleta/qwik-feather-icons/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/egmaleta%2Fqwik-feather-icons/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264958194,"owners_count":23689010,"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":["feather-icons","icons","qwik","qwik-framework","svg","svg-icons","ui-components"],"created_at":"2024-08-04T18:00:48.215Z","updated_at":"2025-07-12T07:33:08.565Z","avatar_url":"https://github.com/egmaleta.png","language":"TypeScript","funding_links":[],"categories":["Library"],"sub_categories":["External Resources"],"readme":"# Feather Icons for Qwik\n\n## What is Feather?\n\nFeather is a collection of simply beautiful open source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency, and flexibility.\n\nThis icon library supports Feather Icons [v4.29.0](https://feathericons.com).\n\n### Installation\n\n```shell\nnpm install --save qwik-feather-icons\n```\n\n### Usage\n\n#### Include\n\nYou can import the icon(s) you need as usual:\n\n```ts\nimport { ThumbsUpIcon } from \"qwik-feather-icons\";\n```\nor import them all at once:\n\n```ts\nimport * as IconPack from \"qwik-feather-icons\";\n\nexport const App = component$(() =\u003e {\n  return (\n    \u003cdiv\u003e\n      \u003cIconPack.ThumbsUpIcon /\u003e\n      \u003cIconPack.BatteryChargingIcon /\u003e\n    \u003c/div\u003e\n  );\n});\n\n```\n\n#### Props\n\nAll icons have these optional `props`:\n\n```ts\nexport interface IconProps {\n    size?: number,\n    color?: string,\n    strokeWidth?: number,\n    strokeLineCap?: string,\n    strokeLineJoin?: string,\n    class?: string\n}\n```\n\nWith default values defined in a `defaultIconProps` object:\n\n```ts\nexport const defaultIconProps: IconProps = {\n  size: 24,\n  color: \"currentColor\",\n  strokeWidth: 2,\n  strokeLineCap: \"round\",\n  strokeLineJoin: \"round\",\n  class: \"\"\n};\n```\n\n#### `Icon` Component\n\nThis icon library has an `Icon` component with a required prop called `name`:\n```tsx\nimport { Icon } from \"qwik-feather-icons\";\n\nexport const App = component$(() =\u003e {\n  return (\n    \u003cdiv\u003e\n      \u003cIcon name=\"battery-charging\" /\u003e { /* equivalent to \u003cBatteryChargingIcon /\u003e */ }\n    \u003c/div\u003e\n  );\n});\n```\n\nAlthough is better to use the `\u003c'Name'Icon /\u003e` variant (such as `\u003cThumbsUpIcon /\u003e`) because it wraps the actual inline `\u003csvg\u003e`.\n\n#### `IconContext`\n\nFeather icons use Qwik Context to simply apply default `props` to all icons. Use `useContextProvider` at the root of the app (or anywhere above the icons in the tree) and pass in a configuration object with props to be applied by default to all icons.\n\n```tsx\nimport { component$, useContextProvider } from \"@builder.io/qwik\";\nimport { IconContext, WifiOffIcon, ThumbsUpIcon } from \"qwik-feather-icons\";\n\nexport const App = component$(() =\u003e {\n  const newDefaultProps = {\n    size: 96,\n    color: \"hotpink\",\n    strokeWidth: 2,\n    strokeLineCap: \"round\",\n    strokeLineJoin: \"round\",\n    class: \"just an example\"\n  };\n\n  useContextProvider(IconContext, newDefaultProps);\n\n  return (\n    \u003cdiv\u003e\n      \u003cThumbsDownIcon /\u003e { /* huge (96px) hotpink icon */ }\n      \u003cWifiOffIcon /\u003e    { /* same here */ }\n    \u003c/div\u003e\n  );\n});\n```\n\n### License\n\nThis package is licensed under the [MIT License](https://github.com/yeyon/qwik-feather-icons/blob/main/LICENSE).\n\n### Acknowledgment\n\nThanks to **Cole Bemis** for the Feather Project. Here is his website https://colebemis.com/.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fegmaleta%2Fqwik-feather-icons","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fegmaleta%2Fqwik-feather-icons","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fegmaleta%2Fqwik-feather-icons/lists"}