{"id":15389351,"url":"https://github.com/dutchcelt/system.css","last_synced_at":"2026-01-22T05:05:11.356Z","repository":{"id":214989619,"uuid":"737759310","full_name":"dutchcelt/system.css","owner":"dutchcelt","description":"A base stylesheet using system colors and css keywords","archived":false,"fork":false,"pushed_at":"2024-07-07T18:02:09.000Z","size":435,"stargazers_count":15,"open_issues_count":0,"forks_count":0,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-09-27T03:44:19.564Z","etag":null,"topics":["browser","css","html"],"latest_commit_sha":null,"homepage":"https://projects.dutchcelt.com/system.css/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dutchcelt.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}},"created_at":"2024-01-01T11:48:57.000Z","updated_at":"2025-08-31T10:50:18.000Z","dependencies_parsed_at":null,"dependency_job_id":"ae1e01fe-8a30-4b37-b509-0f7990272193","html_url":"https://github.com/dutchcelt/system.css","commit_stats":null,"previous_names":["dutchcelt/system.css"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/dutchcelt/system.css","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dutchcelt%2Fsystem.css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dutchcelt%2Fsystem.css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dutchcelt%2Fsystem.css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dutchcelt%2Fsystem.css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dutchcelt","download_url":"https://codeload.github.com/dutchcelt/system.css/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dutchcelt%2Fsystem.css/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28655099,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-22T01:17:37.254Z","status":"online","status_checked_at":"2026-01-22T02:00:07.137Z","response_time":144,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["browser","css","html"],"created_at":"2024-10-01T15:00:10.316Z","updated_at":"2026-01-22T05:05:11.341Z","avatar_url":"https://github.com/dutchcelt.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# system.css\n\nA base stylesheet using system colors and css keywords.\n\n## Goals\n\nSystem.css has a number of goals:\n\n1. Provide a default style for basic html pages.\n2. Provide the means to style the default using custom properties\n3. No dependencies\n4. Based on system colors and CSS keywords. The browser has defaults, so lets use those.\n\n## Demo\n\nhttps://dutchcelt.github.io/system.css/\n\n## Usage\n\nImport via NPM:\n\n```\nnpm i @dutchcelt/system.css\n```\n\nIf you wish to use the layout and form validations you will need to switch the 'system enhancement' on:\n\n```\n\u003chtml lang=\"en\" style=\"--system-enhanced: var(--ON)\"\u003e\n```\n\n### Style API\n\nSystem.css has a number of custom properties for you to use.  \nhttps://dutchcelt.github.io/system.css/style-api.html\n\nAdditionally, `system.css` also provides a simple form layout and validation setup.\n\n### Compatibility\n\nThis solution uses features that might cause issues. Consider the following:  \nContainer Units, CSS nesting, Sub Grid, `color-mix()`, `:has()`, `@property`, and `@layer`.\n\nThese features work in following browsers:\n\n-   Chrome 117+\n-   Safari 16.5+\n-   Firefox 124+\n\n### Acknowledgments\n\nThis is a heavily modified version of [new.css](https://newcss.net)\n\nFor fonts we use what we are given by the OS. My thanks to [Modern Font Stacks](https://modernfontstacks.com).\n\n#### Inspiration\n\nMy admiration and recommendations to consider are\n\n-   [water.css](https://watercss.kognise.dev)\n-   [pico.css](https://picocss.com)\n-   [simple.css](https://simplecss.org)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdutchcelt%2Fsystem.css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdutchcelt%2Fsystem.css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdutchcelt%2Fsystem.css/lists"}