{"id":20923801,"url":"https://github.com/patternfly/design-tokens","last_synced_at":"2026-03-12T22:02:06.974Z","repository":{"id":194343513,"uuid":"690024790","full_name":"patternfly/design-tokens","owner":"patternfly","description":null,"archived":false,"fork":false,"pushed_at":"2026-03-09T19:57:29.000Z","size":5954,"stargazers_count":1,"open_issues_count":8,"forks_count":12,"subscribers_count":27,"default_branch":"main","last_synced_at":"2026-03-09T23:19:55.418Z","etag":null,"topics":["hacktoberfest"],"latest_commit_sha":null,"homepage":"","language":"SCSS","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/patternfly.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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2023-09-11T11:45:54.000Z","updated_at":"2026-03-09T19:54:04.000Z","dependencies_parsed_at":"2023-09-13T00:23:33.928Z","dependency_job_id":"7587e280-7da2-4b60-9689-6b0db99a9461","html_url":"https://github.com/patternfly/design-tokens","commit_stats":null,"previous_names":["patternfly/style-dictionary","patternfly/design-tokens"],"tags_count":34,"template":false,"template_full_name":null,"purl":"pkg:github/patternfly/design-tokens","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patternfly%2Fdesign-tokens","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patternfly%2Fdesign-tokens/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patternfly%2Fdesign-tokens/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patternfly%2Fdesign-tokens/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/patternfly","download_url":"https://codeload.github.com/patternfly/design-tokens/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patternfly%2Fdesign-tokens/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30441855,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-12T14:34:45.044Z","status":"ssl_error","status_checked_at":"2026-03-12T14:09:33.793Z","response_time":114,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["hacktoberfest"],"created_at":"2024-11-18T20:17:48.720Z","updated_at":"2026-03-12T22:02:06.927Z","avatar_url":"https://github.com/patternfly.png","language":"SCSS","readme":"# Patternfly Design Tokens\n\n## Export tokens from Figma\nInformation about exporting tokens from the Figma Design Tokens \u0026 Styles library is with the [custom exporter](https://github.com/patternfly/design-tokens/tree/main/packages/module/plugins/export-patternfly-tokens).\n\n## Prerequisites\n\nMake sure you have [Node.js](https://nodejs.org/en/download/package-manager) and [Yarn](https://yarnpkg.com/getting-started/install) installed.\n\n## Usage\nOnce the design token JSON files are exported from Figma to the [tokens directories](https://github.com/patternfly/design-tokens/tree/main/packages/module/tokens), use `yarn build:scss` to build the SCSS files to the /build directory\n\nBy default `yarn build:scss` outputs the SCSS with `:root` as a selector, but you can also pass the `--selector` flag (or just `-s` for short) and specify any selector you want, i.e. `yarn build:scss -s .foo` will replace the `:root` selector with `.foo` in the generated SCSS files. \n\nTo generate token variables for PatternFly core, use: \n\n```sh\nyarn build:scss -s \"@mixin pf-v6-tokens\"\n```\n\n`yarn build:docs` and `yarn serve:docs` will build and run the docs locally.\n\n## Note\nWe are temporarily pushing the built SCSS files to the repo for ease of access. Additional PRs should rebuild and repush updated SCSS files if they would be affected by the PR changes, to keep them up to date.\n\n## Docs build\n\nWhenever `yarn build:docs` is executed:\n- the [build:scss](https://github.com/patternfly/design-tokens/blob/main/packages/module/build.js) script is run which transforms tokens pulled from Figma (split into separate token json files in the `/tokens` directory) into combined default and dark theme files (in addition to the .scss files within `build/css`).\n- The two new json files (`token-layers-default.json` and `token-layers-dark.json`) are stored in the [patternfly-docs/content](https://github.com/patternfly/design-tokens/blob/main/packages/module/patternfly-docs/content) directory.\n- The code for generating the table containing all tokens is the [tokensTable.js](https://github.com/patternfly/design-tokens/blob/main/packages/module/patternfly-docs/content/tokensTable.js), which combines the default and dark theme json tokens into one object and consumes it as data.\n- Ultimately, the markdown file which is rendering the docs is [all-patternfly-tokens.md](https://github.com/patternfly/design-tokens/blob/main/packages/module/patternfly-docs/content/all-patternfly-tokens.md). This markdown file imports the tokensTable.js and takes the token theme files as props.\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatternfly%2Fdesign-tokens","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpatternfly%2Fdesign-tokens","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatternfly%2Fdesign-tokens/lists"}