PHPackages                             richard87/twig-sass - 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. [Templating & Views](/categories/templating)
4. /
5. richard87/twig-sass

ActiveLibrary[Templating & Views](/categories/templating)

richard87/twig-sass
===================

A Twig extension/function to render inline SASS files for SEO purposes or to render CSS files with easy customizability

1.0.5(9y ago)62.6kMITPHP

Since Nov 16Pushed 9y ago1 watchersCompare

[ Source](https://github.com/Richard87/twig-sass)[ Packagist](https://packagist.org/packages/richard87/twig-sass)[ RSS](/packages/richard87-twig-sass/feed)WikiDiscussions master Synced today

READMEChangelogDependencies (3)Versions (6)Used By (0)

twig-sass
=========

[](#twig-sass)

A Twig extension/function to render inline SASS files for SEO purposes. You can also use twig variables *inside* your sass files.

Setup:
------

[](#setup)

Add `RenderFunction` to Twig:

```
$twig = new Twig_Environment(new Twig_Loader_Filesystem());
$renderFunction = new \Richard87\TwigSass\RenderFunction(
    new \Leafo\ScssPhp\Compiler(),
    new Richard87\NullCache\NullCachePool()
    );
$twig->addExtension($renderFunction);

```

Or if you are using Symfony, add this to `services.yml`:

```
app.sass_compiler:
    class: Leafo\ScssPhp\Compiler

app.twig.sass_renderer:
    class: Richard87\TwigSass\RenderFunction
    arguments: ['@app.sass_compiler','@cache.app']
    tags:
      - { name: twig.extension}

```

Options
-------

[](#options)

`RenderFunction` takes 4 arguments:

- `Leafo\ScssPhp\Compiler`: does the actual compilation of your sass file
- `PSR6 Cache Pool`: A PSR6 enabled Cache pool is requried for any useful performance
- `importDir`: The location SCSS should look for libraries, usually where your `node_modules` are (mine is in `web`)
- `sassFormater`: How your output should look like. Takes a classname in string format. Can be any of these values:
    - "Leafo\\ScssPhp\\Formatter\\Expanded"
    - "Leafo\\ScssPhp\\Formatter\\Nested"
    - "Leafo\\ScssPhp\\Formatter\\Compressed"
    - "Leafo\\ScssPhp\\Formatter\\Compact"
    - "Leafo\\ScssPhp\\Formatter\\Crunched"

Usage
-----

[](#usage)

Then render inline styles like this:

```

    {{ renderSass("styles.scss.twig") }}

```

styles.scss.twig:

```
$brand-primary: #59cc4a;
$border-radius: 0;
$border-radius-lg: 0;
$border-radius-sm: 0;
@import "node_modules/bootstrap/scss/bootstrap";

```

Notice that `node_modules` is inside the web directory, but that can be easily changed with the `importRootDir` variable.

You can also use the included renderSass filter like this:

```

    {{ '$brand-primary: #59cc4a;@import "node_modules/bootstrap/scss/bootstrap";'|renderSass }}

```

TODO
----

[](#todo)

- Create a Symfony hook that automatically renders `*.scss.twig` templates
- Write tests

###  Health Score

32

—

LowBetter than 69% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity21

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity67

Established project with proven stability

 Bus Factor1

Top contributor holds 100% 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 ~0 days

Total

5

Last Release

3513d ago

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/5749715?v=4)[Richard Hagen](/maintainers/Richard87)[@Richard87](https://github.com/Richard87)

---

Top Contributors

[![Richard87](https://avatars.githubusercontent.com/u/5749715?v=4)](https://github.com/Richard87 "Richard87 (15 commits)")

---

Tags

twigsass

### Embed Badge

![Health badge](/badges/richard87-twig-sass/health.svg)

```
[![Health](https://phpackages.com/badges/richard87-twig-sass/health.svg)](https://phpackages.com/packages/richard87-twig-sass)
```

###  Alternatives

[symfony/symfony

The Symfony PHP framework

31.4k86.9M2.2k](/packages/symfony-symfony)[timber/timber

Create WordPress themes with beautiful OOP code and the Twig Template Engine

5.7k3.6M127](/packages/timber-timber)[twig/intl-extra

A Twig extension for Intl

36567.2M320](/packages/twig-intl-extra)[symfony/ux-twig-component

Twig components for Symfony

22017.2M313](/packages/symfony-ux-twig-component)[symfony/ux-live-component

Live components for Symfony

1636.5M115](/packages/symfony-ux-live-component)[twig/cssinliner-extra

A Twig extension to allow inlining CSS

22919.7M81](/packages/twig-cssinliner-extra)

PHPackages © 2026

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