{"id":18463582,"url":"https://github.com/uinix-js/uinix-theme-spec","last_synced_at":"2026-04-29T16:34:45.923Z","repository":{"id":65372887,"uuid":"507262619","full_name":"uinix-js/uinix-theme-spec","owner":"uinix-js","description":"The default uinix theme spec","archived":false,"fork":false,"pushed_at":"2022-06-26T05:34:51.000Z","size":12,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-16T21:52:34.598Z","etag":null,"topics":["css","design-system","spec","theme","ui","ui-system","uinix"],"latest_commit_sha":null,"homepage":"https://uinix.dev","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/uinix-js.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"license","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":["uinix-js"]}},"created_at":"2022-06-25T09:00:56.000Z","updated_at":"2022-06-25T20:54:17.000Z","dependencies_parsed_at":"2023-01-19T23:35:36.104Z","dependency_job_id":null,"html_url":"https://github.com/uinix-js/uinix-theme-spec","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/uinix-js/uinix-theme-spec","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/uinix-js%2Fuinix-theme-spec","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/uinix-js%2Fuinix-theme-spec/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/uinix-js%2Fuinix-theme-spec/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/uinix-js%2Fuinix-theme-spec/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/uinix-js","download_url":"https://codeload.github.com/uinix-js/uinix-theme-spec/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/uinix-js%2Fuinix-theme-spec/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32435108,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-29T13:34:34.882Z","status":"ssl_error","status_checked_at":"2026-04-29T13:34:29.830Z","response_time":110,"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":["css","design-system","spec","theme","ui","ui-system","uinix"],"created_at":"2024-11-06T09:07:19.998Z","updated_at":"2026-04-29T16:34:45.904Z","avatar_url":"https://github.com/uinix-js.png","language":"JavaScript","funding_links":["https://github.com/sponsors/uinix-js"],"categories":[],"sub_categories":[],"readme":"# uinix-theme-spec\n\n[![Build][build-badge]][build]\n[![Coverage][coverage-badge]][coverage]\n[![Downloads][downloads-badge]][downloads]\n[![Size][bundle-size-badge]][bundle-size]\n\nThe default [`uinix-theme`][uinix-theme] spec.\n\nVisit the [Theme Playground] for interactive demos.\n\n## Contents\n\n- [Install](#install)\n- [Use](#use)\n- [API](#api)\n- [Related](#related)\n- [License](#license)\n\n## Install\n\nThis package is [ESM-only] and requires Node 12+.\n\n```sh\nnpm install uinix-theme-spec\n```\n\n## Use\n\n`uinix-theme-spec` can be used officially with [`uinix-theme`][uinix-theme] or [`uinix-ui`][uinix-ui].\n\n```js\nimport {createTheme} from 'uinix-theme';\nimport themeSpec from 'uinix-theme-spec';\n\nconst theme = createTheme({\n  colors: {\n    brand: {\n      primary: 'red',\n      link: 'blue',\n    },\n  },\n  spacings: {\n    s: 4,\n    m: 8,\n    l: 16,\n  },\n  unsupportedThemeProperty: {}\n}, themeSpec);\n\n\nconsole.log(theme);\n```\n\nYields the following theme object.\n\n```js\nconst theme = {\n  animations: {},\n  backgrounds: {},\n  borders: {},\n  borderStyles: {},\n  borderWidths: {},\n  colors: {\n    brand: {\n      primary: 'red',\n      link: 'blue',\n    },\n  },\n  filters: {},\n  fontFamilies: {},\n  fontSizes: {},\n  fontWeights: {},\n  images: {},\n  keyframes: {},\n  letterSpacings: {},\n  lineHeights: {},\n  opacities: {},\n  radii: {},\n  shadows: {},\n  sizes: {},\n  spacings: {\n    s: 4,\n    m: 8,\n    l: 16,\n  },\n  transforms: {},\n  transitions: {},\n  zIndices: {},\n};\n```\n\nApply the `theme` and `themeSpec` to a theme renderer.\n\n```js\nimport {createThemeRenderer} from 'uinix-theme';\n\nconst renderer = createThemeRenderer({\n  theme,\n  themeSpec,\n});\n```\n\nInitialize the renderer and render a themed style.\n\n```js\nconst style = {\n  color: 'brand.primary',\n  padding: 'm',\n  ':hover \u003e a': {\n    color: 'brand.link',\n    padding: 's',\n  },\n};\n\nrenderer.renderStyle(style);\n```\n\nYields the following rendered CSS\n\n```css\n.x {\n  color: red;\n  padding: 8px;\n}\n.x:hover \u003e a {\n  color: blue;\n  padding: 4px\n}\n```\n\nSee [`uinix-theme`][uinix-theme] for more details.\n\n## API\n\n`uinix-theme-spec` only has a single default export.\n\n### `spec (ThemeSpec)`\n\nA theme spec, usable by a theme renderer.\n\n### Related\n\n- [`uinix-theme`][uinix-theme]\n- [`uinix-theme-spec-theme-ui`][uinix-theme-spec-theme-ui]\n- [`uinix-ui`][uinix-ui]\n\n### License\n\n[MIT][license] © [Chris Zhou][author]\n\n\u003c!-- project --\u003e\n\n[author]: https://github.com/chrisrzhou\n[license]: https://github.com/uinix-js/uinix-theme-spec/blob/main/license\n[build]: https://github.com/uinix-js/uinix-theme-spec/actions\n[build-badge]: https://github.com/uinix-js/uinix-theme-spec/workflows/main/badge.svg\n[coverage]: https://codecov.io/github/uinix-js/uinix-theme-spec\n[coverage-badge]: https://img.shields.io/codecov/c/github/uinix-js/uinix-theme-spec.svg\n[downloads]: https://www.npmjs.com/package/uinix-theme-spec\n[downloads-badge]: https://img.shields.io/npm/dm/uinix-theme-spec.svg\n[bundle-size]: https://bundlephobia.com/result?p=uinix-theme-spec\n[bundle-size-badge]: https://img.shields.io/bundlephobia/minzip/uinix-theme-spec.svg\n[uinix-js]: https://github.com/uinix-js/\n[uinix philosophy]: https://github.com/uinix-js#the-uinix-philosophy\n[uinix-ui]: https://github.com/uinix-js/uinix-ui\n\n\u003c!-- defs --\u003e\n[ESM-only]: https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c\n[theme playground]: https://uinix.dev/tools/uinix-theme-playground\n[uinix-theme]: https://github.com/uinix-js/uinix-theme\n[uinix-theme-spec-theme-ui]: https://github.com/uinix-js/uinix-theme-spec-theme-ui\n[uinix-ui]: https://github.com/uinix-js/uinix-ui\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuinix-js%2Fuinix-theme-spec","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fuinix-js%2Fuinix-theme-spec","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuinix-js%2Fuinix-theme-spec/lists"}