{"id":14981611,"url":"https://github.com/shauchenka/figmex","last_synced_at":"2025-07-08T14:07:43.391Z","repository":{"id":57235320,"uuid":"175973088","full_name":"shauchenka/figmex","owner":"shauchenka","description":"Generate theme assets from Figma ","archived":false,"fork":false,"pushed_at":"2019-03-19T09:34:49.000Z","size":7953,"stargazers_count":4,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-06-27T14:42:56.456Z","etag":null,"topics":["assets","export","figma","figma-api","json","stylesheet"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/shauchenka.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-03-16T13:06:02.000Z","updated_at":"2023-10-19T09:20:08.000Z","dependencies_parsed_at":"2022-08-31T14:11:14.814Z","dependency_job_id":null,"html_url":"https://github.com/shauchenka/figmex","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/shauchenka/figmex","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shauchenka%2Ffigmex","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shauchenka%2Ffigmex/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shauchenka%2Ffigmex/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shauchenka%2Ffigmex/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shauchenka","download_url":"https://codeload.github.com/shauchenka/figmex/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shauchenka%2Ffigmex/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264284385,"owners_count":23584677,"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":["assets","export","figma","figma-api","json","stylesheet"],"created_at":"2024-09-24T14:03:55.981Z","updated_at":"2025-07-08T14:07:43.353Z","avatar_url":"https://github.com/shauchenka.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# figmex\n\nGenerate development-ready theme JSON / SCSS/ LESS files from Figma Styles\n\n- Parse [Styles][] from a Figma file ID\n- Works with [Styled System][] and other CSS-in-JS setups\n- Generetes JSON, ans css compactible with different preprocessors (scss, less, etc.)\n- Built with [figma-api][]\n\n```sh\nnpm i figmex\n```\n\n## Getting Started\n\n1. Install `figmex` as a dev dependency in your project\n2. Get a [personal access token][token] for the Figma API\n3. Create a `.env` file with your access token\n  - `FIGMA_TOKEN=\u003cpersonal-access-token\u003e`\n  - Alternatively add an environment variable for `FIGMA_TOKEN`\n4. Add an npm run script: `figmex \u003cfigma-file-id\u003e` (see params for output)\n5. Run the script to create a `theme.json` and styles file based on Figma Styles\n\nNow `figmex` can export styles from files in strict format, for example please check: https://www.figma.com/file/Z4RWc6X1BN5UlM6myQtt1d/tokens-Copy?node-id=0%3A1 make sure that page and artboard names are the same.\nIn further releases I will add support to export from figma project styles.\n\n## Options\n\nOptions can be passed as CLI flags or included in a `figmex` object in your `package.json`\n\n- `--out-dir`, `-d`: output directory (default current working directory), default './styles'\n- `--format`, `-f`: include additional metadata from the Figma API, default 'less'\n- `--metadata`: include additional metadata from the Figma API\n\nBased on Brent Jackson's [figma-theme](https://github.com/jxnblk/figma-theme)\n\n[Styles]: https://help.figma.com/properties-panel/styles\n[Styled System]: https://jxnblk.com/styled-system\n[token]: https://www.figma.com/developers/docs#auth-dev-token\n[figma-js]: https://github.com/jongold/figma-js\n[figma-api]: https://www.figma.com/developers\n[style-dictionary]: https://github.com/amzn/style-dictionary\n\n\n\n\u003c!--\n- TRi6YSk76405ImoatoMF1u28\n- 2aMG4hw2qp3jSTGmtAMyhZ\n- JGLoPfwRFqCwn4xZ8wUmSwp7\n- Yw9L6FATzLpdcsnA5vdSgCRT\n--\u003e\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshauchenka%2Ffigmex","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshauchenka%2Ffigmex","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshauchenka%2Ffigmex/lists"}