{"id":13577200,"url":"https://github.com/Klarr-Agency/Circum-Icons","last_synced_at":"2025-04-05T11:31:42.006Z","repository":{"id":50064163,"uuid":"478198390","full_name":"Klarr-Agency/Circum-Icons","owner":"Klarr-Agency","description":"Circum is a open source icon library following Google Material Design principles. Every icon was made using a 24x24 grid.","archived":false,"fork":false,"pushed_at":"2024-04-20T18:44:19.000Z","size":2441,"stargazers_count":177,"open_issues_count":2,"forks_count":15,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-11-01T16:05:35.677Z","etag":null,"topics":["circum","free","google-material","icon-library","icon-pack","icons","opensource","pack","react","react-icons","reactjs","svelte","svelte-icon","svelte-icons","sveltekit","svg","svg-icons","vue","vue-icons","vuejs"],"latest_commit_sha":null,"homepage":"https://circumicons.com","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mpl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Klarr-Agency.png","metadata":{"files":{"readme":"README-ES.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","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,"publiccode":null,"codemeta":null},"funding":{"github":["Klarr-Agency"]}},"created_at":"2022-04-05T15:49:25.000Z","updated_at":"2024-11-01T03:51:56.000Z","dependencies_parsed_at":"2023-02-09T09:46:09.690Z","dependency_job_id":"f77c97d2-9444-4569-8e3b-428c021228e6","html_url":"https://github.com/Klarr-Agency/Circum-Icons","commit_stats":{"total_commits":118,"total_committers":7,"mean_commits":"16.857142857142858","dds":"0.30508474576271183","last_synced_commit":"eeef6206df834e6957a45e36d2bfb7459ce6e799"},"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Klarr-Agency%2FCircum-Icons","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Klarr-Agency%2FCircum-Icons/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Klarr-Agency%2FCircum-Icons/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Klarr-Agency%2FCircum-Icons/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Klarr-Agency","download_url":"https://codeload.github.com/Klarr-Agency/Circum-Icons/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223186481,"owners_count":17102468,"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":["circum","free","google-material","icon-library","icon-pack","icons","opensource","pack","react","react-icons","reactjs","svelte","svelte-icon","svelte-icons","sveltekit","svg","svg-icons","vue","vue-icons","vuejs"],"created_at":"2024-08-01T15:01:19.155Z","updated_at":"2024-11-05T14:30:39.362Z","avatar_url":"https://github.com/Klarr-Agency.png","language":"JavaScript","funding_links":["https://github.com/sponsors/Klarr-Agency"],"categories":["JavaScript"],"sub_categories":[],"readme":"# Iconos Circum\n\nEste paquete fue creado siguiendo el material de Google y los principios de diseño de IBM Carbon. Nuestro principal objetivo era mantener una cierta consistencia en todo el set y asegurarnos de que cada icono tuviera el mismo peso visual.\n\nDisponible para estos marcos 👉 React, Vue y Svelte\n\n## Documentación\n[Français](https://github.com/Klarr-Agency/Circum-Icons/blob/main/README-FR.md)\n\n[English](https://github.com/Klarr-Agency/Circum-Icons/blob/main/README.md)\n\n![Circum_Link (1)](https://user-images.githubusercontent.com/87146097/178076202-fbf32509-ec2e-4682-9a1a-ba7eb2da5c58.png)\n\n\n## Instalación\n\nInstalar con npm\n\n### React\n```bash\n  npm i -D @klarr-agency/circum-icons-react\n```\n### Vue.js\n```bash\n  npm i -D @klarr-agency/circum-icons-vue\n```\n### Svelte\n```bash\n  npm i -D @klarr-agency/circum-icons-svelte\n```\n\n## Uso/Ejemplos\n\n```javascript\n// Agregue una de estas 3 líneas a continuación correspondiente a su marco\nimport CircumIcon from \"@klarr-agency/circum-icons-react\"; // React\nimport CircumIcon from \"@klarr-agency/circum-icons-vue\"; // Vue\nimport CircumIcon from \"@klarr-agency/circum-icons-svelte\"; // Svelte\n\n\n\n\u003cCircumIcon name=\"calendar\"/\u003e\n// Puedes cambiar el color y el tamaño\n\u003cCircumIcon name=\"calendar\" color=\"#000\" size=\"48px\"\u003e\n```\n## Características\n### Constructor de matrices\nPuede crear una matriz directamente en nuestro sitio web. No es necesario ir y venir para copiar el nombre de cada icono. \u003cbr\u003e\nEn este ejemplo, puedes ver cómo construir una navegación lateral 🏗👇\n\u003cvideo controls loop autoplay src=\"https://user-images.githubusercontent.com/87146097/178076997-3ca71b79-df70-4ab0-b28d-3d5b6d4fba80.mp4\"\u003e\u003c/video\u003e\nPuede encontrar este ejemplo aquí [Circum-Icons-SvelteKit-Demo](https://github.com/Klarr-Agency/Circum-Icons-SvelteKit-Demo)\n\n### Crear propiedades\nAhora puede ahorrar más tiempo agregando nuevas propiedades en su matriz. Recuerda que debes estar en modo objeto \u003cbr\u003e\nsi quieres ver la sección de propiedades.\n😉😎🤓\n\u003cdiv style=\"margin-bottom:12px;\"\u003e\u003c/div\u003e\n\n![new-properties](https://user-images.githubusercontent.com/87146097/183116759-b32e6aee-a3dc-449f-ba11-f87f833e1f83.gif)\n\n\n\n## Iconos\n\nPuede ver la lista de iconos disponibles en [circumicons.com](https://circumicons.com)\n\n## Mapa vial\n- [X] Administrador de propiedades (Posibilidad de agregar nuevas propiedades en Array Builder) 🏗\n- [ ] Agrega palabras clave a los términos de búsqueda 🔎\n- [ ] Iconos de descarga en el color que elijas 🎨\n- [ ] Cambiar el tamaño de los iconos sobre la marcha 🚀\n- [ ] Opciones del portapapeles en tipo de selección única (etiqueta de componente frente a SVG).📌\n- [ ] Acceso premium // Array Builder para iconos 809, Component Builder y más. 💸\n\n\n## ¡Dónde encontrarnos! 👀\n- [Reddit](https://www.reddit.com/r/circumicons/)\n- [Penpot Libraries](https://penpot.app/libraries-templates.html)\n- [Toools Design](https://www.toools.design/free-open-source-icon-libraries)\n- [Devresourc.es](https://devresourc.es/)\n- [Gumroad](https://klarr.gumroad.com/l/knlpl)\n\n## Autores\n\n-   [@klarr-agency](https://www.github.com/klarr-agency)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FKlarr-Agency%2FCircum-Icons","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FKlarr-Agency%2FCircum-Icons","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FKlarr-Agency%2FCircum-Icons/lists"}