PHPackages                             chasegiunta/scss - 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. chasegiunta/scss

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

chasegiunta/scss
================

Compiler for SCSS

v2.0.1(3y ago)148.6k5[3 issues](https://github.com/chasegiunta/scss/issues)[2 PRs](https://github.com/chasegiunta/scss/pulls)1MITPHPPHP ^8.0.2

Since Jun 4Pushed 1y ago1 watchersCompare

[ Source](https://github.com/chasegiunta/scss)[ Packagist](https://packagist.org/packages/chasegiunta/scss)[ RSS](/packages/chasegiunta-scss/feed)WikiDiscussions master Synced today

READMEChangelog (3)Dependencies (3)Versions (6)Used By (1)

SCSS plugin for Craft CMS 4.x
=============================

[](#scss-plugin-for-craft-cms-4x)

Compile SCSS to CSS in your templates

[![Screenshot](src/icon.svg)](src/icon.svg)

Requirements
------------

[](#requirements)

This plugin requires Craft CMS 4.0.0 or later.

Installation
------------

[](#installation)

To install the plugin, follow these instructions.

1. Open your terminal and go to your Craft project:

    ```
    cd /path/to/project

    ```
2. Then tell Composer to load the plugin:

    ```
    composer require chasegiunta/scss

    ```
3. In the Control Panel, go to Settings → Plugins and click the “Install” button for SCSS.

SCSS Overview
-------------

[](#scss-overview)

Craft conveniently offers `{% css %}` tags to include template-specific styles in the `head` of your page. This plugin takes that functionality a bit further by enabling support for compiling SCSS to CSS with `{% scss %}` using the scssphp library ().

Configuring SCSS
----------------

[](#configuring-scss)

By default, while working with devMode enabled, the styles generated will be output into a readable `expanded` format. If Craft is not running in devMode, the styles will be uglified into a `compressed` format.

You can configure these default output formats by copying the `scss.php` file from the plugin directory in your `config` folder.

Using SCSS
----------

[](#using-scss)

```
{% scss %}
... insert scss here ...
{% endscss %}

```

Given the following SCSS:

```
{% scss %}
/*! Comment */
.navigation {
    ul {
        line-height: 20px;
        color: blue;
        a {
            color: red;
        }
    }
}

.footer {
    .copyright {
        color: silver;
    }
}
{% endscss %}

```

### Output format

[](#output-format)

Specifying an output format will take precedence over any default settings in `config/scss.php`.

`{% scss expanded %}`

```
/*! Comment */
.navigation ul {
  line-height: 20px;
  color: blue;
}
.navigation ul a {
  color: red;
}
.footer .copyright {
  color: silver;
}

```

`{% scss compressed %}`

```
/* Comment*/.navigation ul{line-height:20px;color:blue;}.navigation ul a{color:red;}.footer .copyright{color:silver;}

```

### @import

[](#import)

When you import a file using the `@import` directive, the current path of your Craft install is used as the search path.

Brought to you by [Chase Giunta](https://chasegiunta.com)

###  Health Score

39

—

LowBetter than 84% of packages

Maintenance23

Infrequent updates — may be unmaintained

Popularity31

Limited adoption so far

Community14

Small or concentrated contributor base

Maturity72

Established project with proven stability

 Bus Factor1

Top contributor holds 89.3% 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 ~756 days

Total

3

Last Release

1441d ago

Major Versions

1.0.0 → 2.0.02022-07-24

### Community

Maintainers

![](https://www.gravatar.com/avatar/fddff4e56b10437114fa7021297e8df81a895cd70c3c15bd96e977223d3f3a14?d=identicon)[chasegiunta](/maintainers/chasegiunta)

---

Top Contributors

[![chasegiunta](https://avatars.githubusercontent.com/u/1377169?v=4)](https://github.com/chasegiunta "chasegiunta (25 commits)")[![renovate[bot]](https://avatars.githubusercontent.com/in/2740?v=4)](https://github.com/renovate[bot] "renovate[bot] (3 commits)")

---

Tags

scsscmsCraftcraftcmscraft-plugin

### Embed Badge

![Health badge](/badges/chasegiunta-scss/health.svg)

```
[![Health](https://phpackages.com/badges/chasegiunta-scss/health.svg)](https://phpackages.com/packages/chasegiunta-scss)
```

###  Alternatives

[verbb/formie

The most user-friendly forms plugin for Craft.

102393.6k70](/packages/verbb-formie)[verbb/comments

Add comments to your site.

13753.9k](/packages/verbb-comments)[verbb/navigation

Create navigation menus for your site.

92705.0k18](/packages/verbb-navigation)[verbb/vizy

A flexible visual editor field for Craft.

4250.4k](/packages/verbb-vizy)[verbb/hyper

A user-friendly links field for Craft.

24147.8k12](/packages/verbb-hyper)[verbb/workflow

Enforce multi-step review processes for creating entries.

138124.2k1](/packages/verbb-workflow)

PHPackages © 2026

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