[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-71894":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":16,"stars7d":17,"stars30d":18,"stars90d":16,"forks30d":16,"starsTrendScore":16,"compositeScore":19,"rankGlobal":10,"rankLanguage":10,"license":20,"archived":21,"fork":21,"defaultBranch":22,"hasWiki":21,"hasPages":21,"topics":23,"createdAt":10,"pushedAt":10,"updatedAt":32,"readmeContent":33,"aiSummary":34,"trendingCount":16,"starSnapshotCount":16,"syncStatus":35,"lastSyncTime":36,"discoverSource":37},71894,"open-props","argyleink\u002Fopen-props","argyleink","CSS custom properties to help accelerate adaptive and consistent design.","https:\u002F\u002Fopen-props.style",null,"HTML",5398,214,36,76,0,3,20,38,"MIT License",false,"main",[24,25,26,27,28,29,30,31],"css","css-colors","css-custom-media-queries","css-custom-properties","css-easing-functions","css-gradients","css-normalise","css-utilites","2026-06-12 02:02:55","\u003Cdiv align=\"center\">\n\n![Open Props Logo](https:\u002F\u002Fuser-images.githubusercontent.com\u002F1134620\u002F141246730-7df4cf2a-6249-42ca-a01b-494c3ccddabe.png)\n\n## Open Source CSS Variables\n`colors` `gradients` `shadows` `aspect ratios` `typography`  \n`easings` `animations` `sizes` `borders` `z-indexes` `media-queries`  \n\n[![Tests](https:\u002F\u002Fgithub.com\u002Fargyleink\u002Fopen-props\u002Factions\u002Fworkflows\u002Ftests.yml\u002Fbadge.svg?branch=main)](https:\u002F\u002Fgithub.com\u002Fargyleink\u002Fopen-props\u002Factions\u002Fworkflows\u002Ftests.yml)\n[![npm version](http:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002Fopen-props.svg)](https:\u002F\u002Fnpmjs.org\u002Fpackage\u002Fopen-props)\n![Discord](https:\u002F\u002Fbadgen.net\u002Fdiscord\u002Fmembers\u002FAqA4fU886r)\n\u003Cbr>\n\n### Need help?   👉   [Discord](https:\u002F\u002Fdiscord.gg\u002FAqA4fU886r) \n\u003C\u002Fdiv>\n\n\u003Cbr>\n\n#### CDN ([browse](https:\u002F\u002Funpkg.com\u002Fbrowse\u002Fopen-props@latest\u002F))\n- [https:\u002F\u002Funpkg.com\u002Fopen-props](https:\u002F\u002Funpkg.com\u002Fopen-props)\n- [https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fnormalize.min.css](https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fnormalize.min.css) - Normalize (light + dark) [demo](https:\u002F\u002Fcodepen.io\u002Fargyleink\u002Fpen\u002FKKvRORE)\n- [https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fopen-props.tokens.json](https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fopen-props.tokens.json) - Design Tokens\n- [https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fopen-props.figma-tokens.sync.json](https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fopen-props.figma-tokens.sync.json) - Figma Design Tokens\n- [https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fopen-props.style-dictionary-tokens.json](https:\u002F\u002Funpkg.com\u002Fopen-props\u002Fopen-props.style-dictionary-tokens.json) - Style Dictionary Tokens\n\n#### Bookmarklet\n\n```js\njavascript: (() => {\n  const href = \"https:\u002F\u002Funpkg.com\u002Fopen-props\";\n  document.head.append(Object.assign(document.createElement(\"link\"),{rel:\"stylesheet\",href}));\n})();\n```\n\n#### CLI\n- `npm run gen:op` - runs through `src\u002F` js files and creates the PostCSS files in `src\u002F`\n- `npm run gen:nowhere`  - creates a version of Open Props without the use of `:where()`\n- `npm run gen:shadowdom` - creates a version of Open Props with `:host` as the selector scope\n- `npm run gen:prefixed` - creates a version of Open Props with each prop prefixed with `op`, like `--op-font-size-1`\n- `npm run bundle` - creates all the various minified bundles of props\n- `npm run lib:js` - builds the JS modules for NPM\n\n#### Testing\n```bash\nnpm run build && npm run bundle\nnpm test\n```\n","Open Props 是一个提供 CSS 自定义属性的项目，旨在加速适应性和一致性设计。它包含了一系列预定义的 CSS 变量，如颜色、渐变、阴影、字体排版等，支持自定义媒体查询和动画效果等功能。这些特性使得开发者能够更高效地创建响应式网页设计，并且易于维护和扩展。此外，该项目还提供了通过 CDN 引用样式表、书签工具以及命令行工具等多种使用方式，方便用户根据实际需求选择合适的集成方法。适用于需要快速构建具有高度一致性的前端界面的各种场景。",2,"2026-06-11 03:39:21","high_star"]