{"id":13795339,"url":"https://github.com/OvidijusParsiunas/css-filter-converter","last_synced_at":"2025-05-12T22:30:59.666Z","repository":{"id":135488333,"uuid":"444633119","full_name":"OvidijusParsiunas/css-filter-converter","owner":"OvidijusParsiunas","description":"A very simple tool used to convert basic css color formats to and from css filter :art:","archived":false,"fork":false,"pushed_at":"2024-09-03T14:44:29.000Z","size":14806,"stargazers_count":36,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-11-14T16:03:39.541Z","etag":null,"topics":["color","converter","css","filter","hex","hexadecimal","hsl","icon","rgb","svg"],"latest_commit_sha":null,"homepage":"https://cssfilterconverter.com","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/OvidijusParsiunas.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,"publiccode":null,"codemeta":null}},"created_at":"2022-01-05T02:22:37.000Z","updated_at":"2024-10-31T11:29:06.000Z","dependencies_parsed_at":null,"dependency_job_id":"60b7245d-1ffb-4548-9bdf-ec829a0b590c","html_url":"https://github.com/OvidijusParsiunas/css-filter-converter","commit_stats":{"total_commits":231,"total_committers":1,"mean_commits":231.0,"dds":0.0,"last_synced_commit":"9e2bb8987df19a28de7170bed15c9027e94300eb"},"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OvidijusParsiunas%2Fcss-filter-converter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OvidijusParsiunas%2Fcss-filter-converter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OvidijusParsiunas%2Fcss-filter-converter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/OvidijusParsiunas%2Fcss-filter-converter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/OvidijusParsiunas","download_url":"https://codeload.github.com/OvidijusParsiunas/css-filter-converter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225157000,"owners_count":17429698,"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":["color","converter","css","filter","hex","hexadecimal","hsl","icon","rgb","svg"],"created_at":"2024-08-03T23:00:54.786Z","updated_at":"2024-11-18T09:32:04.281Z","avatar_url":"https://github.com/OvidijusParsiunas.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e \n    \u003cimg style=\"margin-left: -15px; transform: scaleX(0.96)\" width=\"70%\" src=\"./readme/images/logo-2.png\" alt=\"Logo\"\u003e\n\u003c/p\u003e\n\n## Description\n\nCSS Filter Converter is a simple tool used for converting basic css color formats to and from css filter. It can be accessed through a dedicated [website](https://cssfilterconverter.com) or directly injected into your project via [NPM](https://npmjs.com/package/css-filter-converter).\n\n## Features\n\n### Supported formats\n\n|             | Hex | RGB | HSL | Keyword |\n| ----------- | :-: | :-: | :-: | :-----: |\n| To filter   |  ✓  |  ✓  |  ✓  |    ✓    |\n| From filter |  ✓  |  ✓  |  ✓  |    ✗    |\n\n### Icon Mode\n\nFilter css property can be used to set the color of your SVG images. Icon Mode panel allows you to upload your SVG images directly into this tool and immediately apply the result filter css value to them (This tool operates locally on your browser and no data leaves the privacy of your computer):\n\n\u003cp align=\"center\"\u003e\n    \u003cimg width=\"830\" src=\"./readme/gifs/icon-mode.gif\" alt=\"Logo\"\u003e\n\u003c/p\u003e\n\n### Sheen\n\nIn practice, filter css property is used to edit the color properties of the element that it is applied to, but it will not completely override the existing colors. This behaviour can sometimes make it difficult to apply a consistent mono color for the underlying contents, leaving an undesirable partial color change effect that is especially evident in SVG images. The Sheen option is used to reinforce the application of the filter color by prepending the following properties \u003cb\u003e'brightness(0) saturate(100%)'\u003c/b\u003e that will always result in a well saturated single hue color:\n\n\u003cp align=\"center\"\u003e\n    \u003cimg width=\"830\" src=\"./readme/gifs/sheen.gif\" alt=\"Logo\"\u003e\n\u003c/p\u003e\n\n## More information\n\n- [Website](https://github.com/OvidijusParsiunas/css-filter-converter/tree/main/website)\n- [NPM](https://github.com/OvidijusParsiunas/css-filter-converter/tree/main/npm)\n\n## Contributions\n\nOpen source is built by the community for the community. All contributions to this project are welcome!\n\u003cbr\u003e Additionally, if you have any suggestions for enhancements, ideas on how to take the project further or have discovered a bug, do not hesitate to create a new issue ticket and we will look into it as soon as possible!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FOvidijusParsiunas%2Fcss-filter-converter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FOvidijusParsiunas%2Fcss-filter-converter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FOvidijusParsiunas%2Fcss-filter-converter/lists"}