{"id":15470552,"url":"https://github.com/savvy-css/savvy","last_synced_at":"2026-05-05T22:37:36.422Z","repository":{"id":57356209,"uuid":"86630184","full_name":"savvy-css/savvy","owner":"savvy-css","description":"A Lightweight \u0026 Highly-Composable Modular CSS Framework","archived":false,"fork":false,"pushed_at":"2018-01-16T19:18:12.000Z","size":97,"stargazers_count":0,"open_issues_count":2,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-17T08:11:20.428Z","etag":null,"topics":["css","css-framework","echobind","functional-css","postcss","savvy-css"],"latest_commit_sha":null,"homepage":"","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/savvy-css.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-03-29T21:16:45.000Z","updated_at":"2017-05-21T03:13:46.000Z","dependencies_parsed_at":"2022-09-26T16:32:08.745Z","dependency_job_id":null,"html_url":"https://github.com/savvy-css/savvy","commit_stats":null,"previous_names":["briansipple/savvy-css"],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/savvy-css%2Fsavvy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/savvy-css%2Fsavvy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/savvy-css%2Fsavvy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/savvy-css%2Fsavvy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/savvy-css","download_url":"https://codeload.github.com/savvy-css/savvy/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246034179,"owners_count":20712851,"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":["css","css-framework","echobind","functional-css","postcss","savvy-css"],"created_at":"2024-10-02T02:05:21.532Z","updated_at":"2026-05-05T22:37:31.377Z","avatar_url":"https://github.com/savvy-css.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Savvy CSS\n\n[![Latest NPM release][npm-badge]][npm-badge-url]\n![Download Count All-Time][download-count-badge]\n[![License][license-badge]][license-badge-url]\n[![Dependencies][dependencies-badge]][dependencies-badge-url]\n[![Dev Dependencies][devDependencies-badge]][devDependencies-badge-url]\n\n_A Lightweight \u0026 Highly-Composable Modular CSS Framework_.\n\n## Usage \n\n### Installation\n\n```shell\nyarn add --dev @savvy-css/savvy\n```\n\n### Getting Started\n\nThis project includes _all_ of the modules that comprise Savvy CSS. You can install it using the command above.\n(Our examples use [`yarn`](https://yarnpkg.com), but `npm` will also do.)\n\nFor more modular usage, you can also install [individual packages](https://www.npmjs.com/org/savvy-css).\n\n```shell\nyarn add --dev @savvy-css/utilities @savvy-css/garnishes\n```\n\n## Design Goals\n\nThe _Savvy_ approach to CSS favors:\n\n- Expressivity: Classes that communicate visual styling.\n\n- Separation of Concerns: Clearly defined [\"namespace\" prefixes](./doc/architecture/namespaces.md) to indicate the kind of effect a class \nis trying to have.\n\n- Utility: Focused classes that keep CSS [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself).\n\n- Reusability \u0026 Maintenance: A common (i.e.: composition-based) approach for styling basic _and_ more-sophisticated components.\n\n- Responsive design: Lightweight styles that assume small-screen (i.e.: mobile) interfaces as their default.\n\n- Learnability: Designing systems that are easy for developers and designers to learn and use.\n\n- Performance: Delivering a super-small amount of CSS to devices, browsers, and users.\n\n- Adherence to the [principles of motion design. (More on this coming soon!)\n\nCheck out the[documentation folder](./doc) for more details.\n\n## Benefits\n\n- Smaller, Simpler, DRY CSS... which stays that way thanks to its composability\n- Easier layout refactoring and experimentation\n- Designed for scalability\n- Designed for portability (contribute to the project directly... or fork it as the starting point for your own)\n- Clean foundational defaults for HTML elements\n\n\n\n[npm-badge]: https://img.shields.io/npm/v/@savvy-css/savvy.svg\n[npm-badge-url]: https://www.npmjs.com/package/@savvy-css/savvy\n[download-count-badge]: https://img.shields.io/npm/dt/@savvy-css/savvy.svg\n[license-badge]: https://img.shields.io/npm/l/@savvy-css/savvy.svg\n[license-badge-url]: ./LICENSE\n[dependencies-badge]: https://img.shields.io/david/savvy-css/savvy.svg\n[dependencies-badge-url]: https://david-dm.org/savvy-css/savvy\n[devDependencies-badge]: https://img.shields.io/david/dev/savvy-css/savvy.svg\n[devDependencies-badge-url]: https://david-dm.org/savvy-css/savvy#info=devDependencies","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsavvy-css%2Fsavvy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsavvy-css%2Fsavvy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsavvy-css%2Fsavvy/lists"}