PHPackages dezudas/gaida - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Framework](/categories/framework) 4. / 5. dezudas/gaida ActiveLibrary[Framework](/categories/framework) dezudas/gaida ============= A minimalist CSS framework with modern grid system. 1.3.0(9y ago)7101[1 issues](https://github.com/dezudas/gaida/issues)MITSCSSCI passing Since Nov 14Pushed 3w ago4 watchersCompare [ Source](https://github.com/dezudas/gaida)[ Packagist](https://packagist.org/packages/dezudas/gaida)[ Docs](https://milligram.github.io)[ RSS](/packages/dezudas-gaida/feed)WikiDiscussions master Synced today READMEChangelog (1)DependenciesVersions (3)Used By (0) Gaida CSS Framework =================== [](#gaida-css-framework) > A minimalist, mobile-first CSS foundation — small by design, built to extend. Gaida provides just enough structure to start a project: a modern 12-column flexbox grid, sensible typography, form and button resets, and a set of utility helpers — all in a single compiled CSS file. It is intentionally lean so you can layer your own design system on top. [![npm version](https://camo.githubusercontent.com/9785de7b3cff1657e0a232452ac3195323eb058da7f4f3078dc7e5b9b57b22a1/68747470733a2f2f62616467652e667572792e696f2f6a732f67616964612e737667)](https://badge.fury.io/js/gaida)[![npm downloads](https://camo.githubusercontent.com/56b6f8f8d16c431b8b0a9540a62a7a96c2facfc05239039078b6f9668c5d2a5a/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f64742f67616964612e737667)](https://www.npmjs.com/package/gaida) --- Install ------- [](#install) **npm** ``` npm install gaida ``` **yarn** ``` yarn add gaida ``` **CDN** ``` ``` --- Usage ----- [](#usage) Link the compiled CSS directly: ``` ``` Or import the SCSS source into your own stylesheet and override variables before the import: ``` // Override defaults before importing $color-primary: #6200ea; $font-family-sans-serif: "Inter", sans-serif; @import "node_modules/gaida/src/gaida"; ``` --- Build Output ------------ [](#build-output) ``` dist/ ├── gaida.css ← expanded (development) └── gaida.min.css ← compressed (production) docs/css/ └── gaida.min.css ← docs copy ``` --- SCSS Architecture ----------------- [](#scss-architecture) ``` src/ ├── gaida.scss ← entry point (imports only) ├── _Color.scss ← color palette tokens ├── _Variables.scss ← typography, spacing, breakpoints ├── _Base.scss ← box-sizing, html/body defaults ├── _Grid.scss ← 12-column flexbox responsive grid ├── _Typography.scss ← h1–h6 scale, text utilities ├── _Button.scss ← solid, outline, clear button variants ├── _Form.scss ← inputs, textarea, select, label ├── _Table.scss ← striped + hover table ├── _List.scss ← ol / ul / dl resets ├── _Code.scss ← inline code + pre blocks ├── _Blockquote.scss ← bordered blockquote ├── _Divider.scss ← hr styling ├── _Image.scss ← responsive images (max-width: 100%) ├── _Link.scss ← anchor color + hover ├── _Spacing.scss ← global bottom-margin scale └── _Utility.scss ← clearfix, float helpers ``` All variables in `_Variables.scss` and `_Color.scss` use `!default`, so you can override any value before importing. --- Grid ---- [](#grid) Gaida uses a 12-column flexbox grid with five responsive breakpoints: BreakpointClass prefixWidthExtra small`.col-xs-*`≤ 480pxSmall`.col-sm-*`≤ 600pxMedium`.col-md-*`≤ 840pxLarge`.col-lg-*`≤ 960pxExtra large`.col-xl-*`≤ 1280px``` Left Right ``` Use `.col-gapless` on `.grid` to remove gutters, `.col-oneline` to prevent wrapping. --- Browser Support --------------- [](#browser-support) BrowserMinimum versionChrome90+Firefox90+Edge90+Safari14+iOS14+Internet Explorer is not supported. --- Development ----------- [](#development) ### Requirements [](#requirements) - **Node.js** >= 18 ### Setup [](#setup) ``` git clone https://github.com/dezudas/gaida.git cd gaida npm install ``` ### Commands [](#commands) CommandDescription`npm start`Build, watch for changes, and serve`npm run build`Full build (clean → sass → autoprefixer)`npm run sass`Compile SCSS to CSS`npm run autoprefixer`Run PostCSS autoprefixer on dist`npm run watch`Watch `src/**/*.scss` and rebuild`npm run serve`Start Browser-sync dev server`npm run clean`Delete the `dist/` folder### Toolchain [](#toolchain) ToolVersionPurpose[Dart Sass](https://sass-lang.com/dart-sass)^1.99SCSS compilation[PostCSS](https://postcss.org/)^8.5CSS transformation[autoprefixer](https://github.com/postcss/autoprefixer)^10.5Vendor prefix injection[browser-sync](https://browsersync.io/)^3.0Live reload dev server[npm-run-all2](https://github.com/bcomnes/npm-run-all2)^8.0Parallel/sequential npm scripts[onchange](https://github.com/Qard/onchange)^7.1File watcher[rimraf](https://github.com/isaacs/rimraf)^6.1Cross-platform `rm -rf`--- Contributing ------------ [](#contributing) 1. Fork the repository 2. Create a feature branch: `git checkout -b feature/my-change` 3. Make your changes inside `src/` 4. Run `npm run build` to verify compilation 5. Submit a pull request Please keep changes minimal and aligned with the framework's philosophy: small file size, sensible defaults, easy to override. Report bugs or request features via [GitHub Issues](https://github.com/dezudas/gaida/issues). --- License ------- [](#license) MIT © [Dijup Tuladhar](https://github.com/dezudas) Maintained under [Semantic Versioning](https://semver.org/). ### Health Score 39 — LowBetter than 86% of packages Maintenance59 Moderate activity, may be stable Popularity11 Limited adoption so far Community12 Small or concentrated contributor base Maturity64 Established project with proven stability Bus Factor1 Top contributor holds 53.6% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~73 days Total 2 Last Release 3393d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/dca1f59a776eb3f18e372920516ff6fb3842ba7f64d8401e10a7b694d21e5c23?d=identicon)[dezudas](/maintainers/dezudas) --- Top Contributors [![cjpatoilo](https://avatars.githubusercontent.com/u/1542831?v=4)](https://github.com/cjpatoilo "cjpatoilo (37 commits)")[![dezudas](https://avatars.githubusercontent.com/u/289415?v=4)](https://github.com/dezudas "dezudas (32 commits)") --- Tags csscss-frameworkcss-gridsass-frameworkframeworkcsshtmlHTML5sassscsslessmobilebootstrapresponsivefront-endmobile-firstCSS3kickstarterpostcssflexboxstylus ### Embed Badge ![Health badge](/badges/dezudas-gaida/health.svg) ``` [![Health](https://phpackages.com/badges/dezudas-gaida/health.svg)](https://phpackages.com/packages/dezudas-gaida) ``` ### Alternatives [twbs/bootstrap The most popular front-end framework for developing responsive, mobile first projects on the web. 174.1k17.6M327](/packages/twbs-bootstrap)[twitter/bootstrap The most popular front-end framework for developing responsive, mobile first projects on the web. 174.1k1.7M27](/packages/twitter-bootstrap)[zurb/foundation The most advanced responsive front-end framework in the world. 29.8k380.2k15](/packages/zurb-foundation)[foundation/foundation-sites The most advanced responsive front-end framework in the world. 29.8k8.4k](/packages/foundation-foundation-sites)[coreui/coreui The most popular front-end framework for developing responsive, mobile-first projects on the web rewritten and maintain by the CoreUI Team 873111.6k4](/packages/coreui-coreui)[components/bootstrap The most popular front-end framework for developing responsive, mobile first projects on the web. 932.8M63](/packages/components-bootstrap) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)