PHPackages                             silverstripe/theme-colorpicker - 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. silverstripe/theme-colorpicker

ActiveSilverstripe-vendormodule[Utility & Helpers](/categories/utility)

silverstripe/theme-colorpicker
==============================

Color picker module for the site available under admin settings

21.1k2PHPCI failing

Since Jul 31Pushed 6y ago5 watchersCompare

[ Source](https://github.com/silverstripe/silverstripe-theme-colorpicker)[ Packagist](https://packagist.org/packages/silverstripe/theme-colorpicker)[ RSS](/packages/silverstripe-theme-colorpicker/feed)WikiDiscussions master Synced 2d ago

READMEChangelogDependenciesVersions (1)Used By (0)

Colorpicker Module
==================

[](#colorpicker-module)

[![Build Status](https://camo.githubusercontent.com/534100dd001ac7b53e2c1046c2b0611b373139dd0db2fe8a08f1d3044f42eda5/68747470733a2f2f7472617669732d63692e6f72672f73696c7665727374726970652f73696c7665727374726970652d7468656d652d636f6c6f727069636b65722e7376673f6272616e63683d6d6173746572)](https://travis-ci.org/silverstripe/silverstripe-theme-colorpicker)[![Scrutinizer Code Quality](https://camo.githubusercontent.com/a75db7afeabb9b857e4bcee37625f66e55a1af7ece923c6d02cd735e136e84f2/68747470733a2f2f7363727574696e697a65722d63692e636f6d2f672f73696c7665727374726970652f73696c7665727374726970652d7468656d652d636f6c6f727069636b65722f6261646765732f7175616c6974792d73636f72652e706e673f623d6d6173746572)](https://scrutinizer-ci.com/g/silverstripe/silverstripe-theme-colorpicker/?branch=master)[![codecov](https://camo.githubusercontent.com/ec18d68ec206b354a14c882f967639552b1225ac11608345e9ccb3deff90bb4a/68747470733a2f2f636f6465636f762e696f2f67682f73696c7665727374726970652f73696c7665727374726970652d7468656d652d636f6c6f727069636b65722f6272616e63682f6d61737465722f67726170682f62616467652e737667)](https://codecov.io/gh/silverstripe/silverstripe-theme-colorpicker)

This module provides a [Theme color picker](docs/en/01_Features/ThemeColors.md). It allows CMS users to adjust the colors of different areas of their site without requiring developer intervention.

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

[](#installation)

To install this module, you can do so with Composer:

```
composer require silverstripe/theme-colorpicker

```

Usage
-----

[](#usage)

### Enabling

[](#enabling)

By default the theme color picker is disabled, to enable this you can adjust your YAML configuration. E.g. in `app/_config/config.yml`:

```
SilverStripe\SiteConfig\SiteConfig:
  enable_theme_color_picker: true
```

### Adjusting/adding colors

[](#adjustingadding-colors)

Colorpicker is already supported by the [Watea](https://github.com/silverstripe/cwp-watea-theme) and [Bambusa](https://github.com/silverstripe/bambusa-theme) themes and will work out of the box.

The theme colors are all configurable, so via YAML configuration you can adjust existing colors or add new ones to the theme color picker. see `ColorpickerSiteConfigExtension.theme_colors` for a list of the default colors.

```
SilverStripe\SiteConfig\SiteConfig:
  enable_theme_color_picker: true
  theme_colors:
    # Edit existing pink color
    pink:
      Color: '#C12099'
    # Add new brown color
    brown:
      Title: 'Brown'
      CSSClass: 'brown'
      Color: '#594116'
```

Now you can add the matching color to your SCSS. Assuming your project is using a custom theme which imports Wātea's `main.scss` file, create a `$custom-theme-colors` as follows:

```
// themes/customtheme/scss/main.scss

// Ensure this variable is set before importing watea scss
$custom-theme-colors: (
  'pink': #C12099, // Adjusting existing pink color
  'brown': #594116 // Adding new brown color
);

@import '../../../watea/src/scss/main';
```

For more information on using customisable theme colors in the Wātea theme, please refer to the CWP Developer documentation: [Using the Wātea theme](https://github.com/silverstripe/cwp/blob/master/docs/en/01_Working_with_projects/14_Using_the_Watea_theme.md).

Using in your own theme
-----------------------

[](#using-in-your-own-theme)

First, ensure that there is a HTML `class` present in your template which indicates the theme variation to the CSS. Below is the default implementation which you'll also find in the Bambusa and Watea theme.

```

```

You can now either manually generated the colour variations in your CSS (class name suffixes), or you can trawl through the `src/scss` folder in either the Bambusa or Watea theme to find out how to use `@mixin` in SCSS to achieve that automatically.

Versioning
----------

[](#versioning)

This library follows [Semver](http://semver.org). According to Semver, you will be able to upgrade to any minor or patch version of this library without any breaking changes to the public API. Semver also requires that we clearly define the public API for this library.

All methods, with `public` visibility, are part of the public API. All other methods are not part of the public API. Where possible, we'll try to keep `protected` methods backwards-compatible in minor/patch versions, but if you're overriding methods then please test your work before upgrading.

###  Health Score

24

—

LowBetter than 31% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity19

Limited adoption so far

Community17

Small or concentrated contributor base

Maturity37

Early-stage or recently created project

 Bus Factor1

Top contributor holds 81.8% 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.

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/654636?v=4)[Aaron Carlino](/maintainers/unclecheese)[@unclecheese](https://github.com/unclecheese)

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

![](https://avatars.githubusercontent.com/u/111025?v=4)[Ingo Schommer](/maintainers/chillu)[@chillu](https://github.com/chillu)

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

![](https://www.gravatar.com/avatar/afbb3dcc9ef29c1a6eedd6addcae5fce9ab1271915a85a4c349301b71237368d?d=identicon)[silverstripe-machine01](/maintainers/silverstripe-machine01)

![](https://avatars.githubusercontent.com/u/1168676?v=4)[Maxime Rainville](/maintainers/maxime-rainville)[@maxime-rainville](https://github.com/maxime-rainville)

---

Top Contributors

[![chillu](https://avatars.githubusercontent.com/u/111025?v=4)](https://github.com/chillu "chillu (9 commits)")[![bergice](https://avatars.githubusercontent.com/u/541886?v=4)](https://github.com/bergice "bergice (2 commits)")

### Embed Badge

![Health badge](/badges/silverstripe-theme-colorpicker/health.svg)

```
[![Health](https://phpackages.com/badges/silverstripe-theme-colorpicker/health.svg)](https://phpackages.com/packages/silverstripe-theme-colorpicker)
```

###  Alternatives

[lidongyooo/laravel-idempotent

laravel idempotent

122.2k](/packages/lidongyooo-laravel-idempotent)

PHPackages © 2026

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