{"id":13456388,"url":"https://github.com/jvalen/pixel-art-react","last_synced_at":"2025-05-14T02:07:31.071Z","repository":{"id":2864662,"uuid":"47674847","full_name":"jvalen/pixel-art-react","owner":"jvalen","description":"Pixel art animation and drawing web app powered by React","archived":false,"fork":false,"pushed_at":"2024-01-29T23:24:02.000Z","size":3767,"stargazers_count":5574,"open_issues_count":0,"forks_count":315,"subscribers_count":70,"default_branch":"master","last_synced_at":"2025-04-10T19:51:02.227Z","etag":null,"topics":["animation","css","draw","javascript","pixel-art","react","redux"],"latest_commit_sha":null,"homepage":"https://www.pixelartcss.com/","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/jvalen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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":"2015-12-09T07:07:53.000Z","updated_at":"2025-04-09T19:33:47.000Z","dependencies_parsed_at":"2023-10-01T20:48:58.537Z","dependency_job_id":"962b811e-3ab8-4954-bb89-bee4530b6d5b","html_url":"https://github.com/jvalen/pixel-art-react","commit_stats":{"total_commits":628,"total_committers":13,"mean_commits":48.30769230769231,"dds":0.0652866242038217,"last_synced_commit":"e57eb0da384aad35ea65f290fa27dd002094c26e"},"previous_names":[],"tags_count":24,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jvalen%2Fpixel-art-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jvalen%2Fpixel-art-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jvalen%2Fpixel-art-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jvalen%2Fpixel-art-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jvalen","download_url":"https://codeload.github.com/jvalen/pixel-art-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254052851,"owners_count":22006717,"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":["animation","css","draw","javascript","pixel-art","react","redux"],"created_at":"2024-07-31T08:01:21.048Z","updated_at":"2025-05-14T02:07:26.061Z","avatar_url":"https://github.com/jvalen.png","language":"JavaScript","readme":"\u003cdiv align=\"center\"\u003e\n  \u003ch3 style=\"color: white;\"\u003e ⚠️ Temporary Limited Interaction Notice ⚠️\u003c/h3\u003e\n  (Please check \u003ca href=\"https://github.com/jvalen/pixel-art-react#contributing\"\u003eContributing\u003c/a\u003e)\n\u003c/div\u003e\n\u003cbr\u003e\n\u003cbr\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"200\" src=\"screenshots/tree-pixelartcss.png\"\u003e\n\u003c/p\u003e\n\u003ch1 align=\"center\"\u003ePixel Art to CSS\u003c/h1\u003e\n\u003cp align=\"center\"\u003e\n  \u003ch3 align=\"center\"\u003e  \n    Animate pixel art and get CSS\n  \u003c/h3\u003e\n\u003c/p\u003e\n\u003cp align=\"center\"\u003e\n  \u003ca target='_blank' href='http://www.recurse.com' title='Made at the Recurse Center'\u003e\u003cimg src='https://cloud.githubusercontent.com/assets/2883345/11325206/336ea5f4-9150-11e5-9e90-d86ad31993d8.png' height='20px'/\u003e\u003c/a\u003e\n  \u003ca href=\"https://travis-ci.com/jvalen/pixel-art-react\"\u003e\u003cimg src=\"https://travis-ci.com/jvalen/pixel-art-react.svg?branch=master\" alt=\"travis ci\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n## Did you know that you can create pixel art using CSS?\n\n**Pixel Art to CSS** is an online editor that helps you with that task.\n\nCombining the power of both **box-shadow** and **keyframes** CSS properties, you will get CSS code ready to use in your site.\n\nFurthermore, you can download your work in different formats such as a static image, animated GIF or sprite like image.\n\n:pencil2: [Try it out](https://www.pixelartcss.com/)\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"600\" src=\"screenshots/screenshot-potion.png\"\u003e\n\u003c/p\u003e\n\n**Pixel Art to CSS** aims to be an intuitive tool by its simplicity, however it is equipped with a wide range of features: customize your color palette, go back and forth in time, modify animation settings, save or load your projects, among others.\n\n## Example\n\nBy default, you will find the following project within the \u003cb\u003eLOAD\u003c/b\u003e section:\n\n![Cat animation example](screenshots/animation-cat.gif)\n\nSee it live at [pixelartcss](https://www.pixelartcss.com/)\n\nYou can also import it directly submitting [this](examples/import-export/cat.txt) code.\n\n## Technical overview\n\nThis application has been built with the following technologies:\n\n- [React](https://facebook.github.io/react/): Library to build the UI.\n- [Redux](http://redux.js.org/): Implements a Flux like architecture.\n- [ImmutableJS](https://facebook.github.io/immutable-js/) Helps to keep the data immutable aiming to avoid side effects.\n- [PostCSS](https://github.com/postcss/postcss) Handle the app CSS.\n\n## Installation\n\n```bash\nnpm install\n```\n\n## Development\n\n```bash\nnpm run development\n```\n\n## Deploy\n\nCreate the production build.\n\n```bash\nnpm run deploy\n```\n\n## Lint\n\nThere are several libraries used in the project that help us to keep our codebase healthy:\n\n- [ESlint](https://eslint.org/)\n- [Stylelint](https://stylelint.io/)\n- [Prettier](https://prettier.io/)\n\nEvery time we commit something it will execute the linters and format the staged files if needed.\n\nIf you want to check them individually you could execute the following scripts:\n\n```bash\nnpm run lint\nnpm run csslint\nnpm run format\n```\n\n## Testing\n\nWe are using [Jest](https://jestjs.io/) as the testing platform.\n\n```bash\nnpm run test\n```\n\n## Contributing\n\n\u003cdiv\u003e\n  \u003cp style=\"color: white;\"\u003e\n    ⚠️ \u003cstrong\u003ePlease Note:\u003c/strong\u003e This repository is currently in a temporary idle state due to a refactor and tech upgrade. I am not accepting new Pull Requests or Issues at the moment. Sorry for the inconveniences.\n  \u003c/p\u003e\n\u003c/div\u003e\n\n~~#### Help me to improve it :seedling:~~\n\n~~Create a GitHub issue if there is something wrong or to be improved.~~\n\n~~Pull requests are also welcome, please take the following requirements as a checklist before opening one:~~\n\n~~- [x] The PR does fix a problem or adds a new feature, not just cosmetic or syntactic sugar changes.~~\n~~- [x] It would be great to open an issue in advance.~~\n~~- [x] The PR should be issued to the **develop** branch.~~\n~~- [x] The PR should have a explanation or be related to an issue.~~\n\n~~Thank you!~~\n\n## License\n\n[MIT](https://opensource.org/licenses/mit-license.php)\nCopyright © 2016 Javier Valencia Romero (@jvalen)\n","funding_links":[],"categories":["JavaScript","Design"],"sub_categories":["Pixel Art"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjvalen%2Fpixel-art-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjvalen%2Fpixel-art-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjvalen%2Fpixel-art-react/lists"}