{"id":15041804,"url":"https://github.com/rholo/atomic-sass","last_synced_at":"2026-01-06T20:36:43.976Z","repository":{"id":57186351,"uuid":"168538338","full_name":"rholo/atomic-sass","owner":"rholo","description":"Atomic Sass is a baseline project to make your own standard CSS Library","archived":false,"fork":false,"pushed_at":"2019-07-15T17:43:57.000Z","size":226,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-01T14:45:15.046Z","etag":null,"topics":["atomic-design","css","framework","library","sass","scss","scss-framework"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rholo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-01-31T14:28:05.000Z","updated_at":"2022-01-25T19:37:45.000Z","dependencies_parsed_at":"2022-09-14T14:21:25.068Z","dependency_job_id":null,"html_url":"https://github.com/rholo/atomic-sass","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rholo%2Fatomic-sass","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rholo%2Fatomic-sass/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rholo%2Fatomic-sass/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rholo%2Fatomic-sass/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rholo","download_url":"https://codeload.github.com/rholo/atomic-sass/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245822367,"owners_count":20678165,"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":["atomic-design","css","framework","library","sass","scss","scss-framework"],"created_at":"2024-09-24T20:46:29.471Z","updated_at":"2026-01-06T20:36:43.949Z","avatar_url":"https://github.com/rholo.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"Atomic Sass\n=========\nAtomic is a baseline SCSS to start your own CSS Library, define just that your project need and make your own lightweight, clean and scalable css.\n\n#### Features\n- Define your own prefix to all classname if you need it!\n- UI Colors defined by Color Names\n- Flexbox Grid for modern browsers or Float Grid and Table Grid for olders\n- Mixins and placeholders ready to use!\n- Normalize or reset not needed\n\n#### How to start\n\ninstall by npm\n```\nnpm i atomic-sass\n```\n\ninstall by yarn\n```\nyarn add atomic-sass\n```\nimport atomic-sass to your project and done.\n```\n@import 'atomic-sass/scss/atomic';\n```\n\n#### Create your own theme\n\nthis is a sample you can use to configurate your own theme really fast\n\n```\n$prefix         : 'at-';\n\n$font-size      : 1.4rem;\n\n$your-font      : '';\n$optional-font  : '';\n\n$font-primary   : $your-font;\n$font-secondary : $optional-font;\n$font-color     : Black;\n$link-color     : MediumSlateBlue;\n\n$red            : Crimson;\n$green          : DarkCyan;\n$blue           : MediumBlue;\n$orange         : DarkOrange;\n$yellow         : Gold;\n$violet         : DarkViolet;\n$grey           : DarkGrey;\n\n$inputs         : true;\n$buttons        : true;\n$table          : false;\n\n$flex-grid      : true;\n$float-grid     : false;\n$fix-grid       : false;\n\n$flex-columns   : 16;\n$grid-space     : 0.5%;\n\n@import 'atomic-sass/scss/atomic';\n\n```\n\n##### Prefix\nYou can define your own prefix to all classname, get more at http://getbem.com/naming/\n\n##### NamedColors\nBy default we define a palette colors with named colors, modern browsers support 140 named colors, get more colors https://htmlcolorcodes.com/color-names/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frholo%2Fatomic-sass","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frholo%2Fatomic-sass","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frholo%2Fatomic-sass/lists"}