PHPackages                             arts/fluid-design-system - 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. [Utility & Helpers](/categories/utility)
4. /
5. arts/fluid-design-system

ActiveWordpress-plugin[Utility & Helpers](/categories/utility)

arts/fluid-design-system
========================

Fluid spacing and typography units for Elementor

v2.3.0(1mo ago)691[2 issues](https://github.com/artkrsk/fluid-design-system-for-elementor/issues)GPL-3.0-or-laterTypeScriptPHP >=8.0CI passing

Since Apr 29Pushed 1mo ago1 watchersCompare

[ Source](https://github.com/artkrsk/fluid-design-system-for-elementor)[ Packagist](https://packagist.org/packages/arts/fluid-design-system)[ Docs](https://artemsemkin.com)[ Fund](https://www.buymeacoffee.com/artemsemkin)[ RSS](/packages/arts-fluid-design-system/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (23)Versions (24)Used By (0)

Fluid Design System for Elementor
=================================

[](#fluid-design-system-for-elementor)

[![Tests](https://camo.githubusercontent.com/917eecd57160258a51e6a59b8a07971bdea270e899cc16a267ea1c1eec208231/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6172746b72736b2f666c7569642d64657369676e2d73797374656d2d666f722d656c656d656e746f722f746573742e796d6c3f7374796c653d666c61742d737175617265266c6f676f3d676974687562616374696f6e73266c6f676f436f6c6f723d7768697465266c6162656c3d7465737473)](https://github.com/artkrsk/fluid-design-system-for-elementor/actions/workflows/test.yml)[![Codecov](https://camo.githubusercontent.com/1fccb4e4b56652ae9b973675c2200d10e1dd4448aec051ef2aeb3bbd11c6b935/68747470733a2f2f636f6465636f762e696f2f67682f6172746b72736b2f666c7569642d64657369676e2d73797374656d2d666f722d656c656d656e746f722f67726170682f62616467652e7376673f746f6b656e3d53345a504c4947494d58)](https://codecov.io/gh/artkrsk/fluid-design-system-for-elementor)[![PHP](https://camo.githubusercontent.com/deaadd52989c4c1a99d361a002fa2e8e62dd24aee74a2026583aad249696a492/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f646570656e64656e63792d762f617274732f666c7569642d64657369676e2d73797374656d2f7068703f7374796c653d666c61742d737175617265266c6f676f3d706870266c6f676f436f6c6f723d7768697465266c6162656c3d504850)](https://packagist.org/packages/arts/fluid-design-system)[![WordPress](https://camo.githubusercontent.com/a7c2022199e899aad398802770a2e6a21d8e5d0840079ce4947724822f309854/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f576f726450726573732d362e302b2d3231373539623f7374796c653d666c61742d737175617265266c6f676f3d776f72647072657373266c6f676f436f6c6f723d7768697465)](https://wordpress.org)

Fluid typography and spacing presets for Elementor using CSS `clamp()` — smooth responsive scaling without breakpoints.

Quick Links
-----------

[](#quick-links)

UsersDevelopers[Install from WordPress.org](https://wordpress.org/plugins/fluid-design-system-for-elementor/)[Developer Hooks Reference](https://artkrsk.github.io/fluid-design-system-for-elementor/developers)[Video Tutorials & Guide](https://artkrsk.github.io/fluid-design-system-for-elementor/guide)[GitHub Releases](https://github.com/artkrsk/fluid-design-system-for-elementor/releases)Development
-----------

[](#development)

```
git clone https://github.com/artkrsk/fluid-design-system-for-elementor.git
cd fluid-design-system-for-elementor
npm install
```

Edit `project.development.js` to set your WordPress plugin path:

```
config.wordpressPlugin.target = '/path/to/your/wordpress/plugins/fluid-design-system-for-elementor'
```

### Commands

[](#commands)

CommandDescription`npm run dev`Development mode with live reload`npm run build`Production build (creates distribution ZIP)---

Made by [Artem Semkin](https://artemsemkin.com)

###  Health Score

41

—

FairBetter than 89% of packages

Maintenance82

Actively maintained with recent releases

Popularity11

Limited adoption so far

Community10

Small or concentrated contributor base

Maturity52

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 98% 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 ~17 days

Total

20

Last Release

57d ago

Major Versions

v1.2.1 → v2.0.02025-12-29

PHP version history (2 changes)v1.0.0PHP >=7.4

v1.2.0PHP >=8.0

### Community

Maintainers

![](https://www.gravatar.com/avatar/7bea30c2234cb7a9564df323f88f993da491615955ed3fb66a42db98c12d0d15?d=identicon)[artkrsk](/maintainers/artkrsk)

---

Top Contributors

[![artkrsk](https://avatars.githubusercontent.com/u/15735987?v=4)](https://github.com/artkrsk "artkrsk (145 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (3 commits)")

---

Tags

clampcsselementorspacingtypographywordpress-plugin

###  Code Quality

Static AnalysisPHPStan

Code StylePHP\_CodeSniffer

Type Coverage Yes

### Embed Badge

![Health badge](/badges/arts-fluid-design-system/health.svg)

```
[![Health](https://phpackages.com/badges/arts-fluid-design-system/health.svg)](https://phpackages.com/packages/arts-fluid-design-system)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)