PHPackages                             rollpix/module-orderstatuscolor - 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. rollpix/module-orderstatuscolor

ActiveMagento2-module[Utility & Helpers](/categories/utility)

rollpix/module-orderstatuscolor
===============================

Magento 2 module to customize order status colors in admin grids with visual color picker

1.0.0(3mo ago)03MITPHPPHP >=7.4 || >=8.0

Since Jan 24Pushed 3mo agoCompare

[ Source](https://github.com/ROLLPIX/M2-order-status-colors)[ Packagist](https://packagist.org/packages/rollpix/module-orderstatuscolor)[ Docs](https://github.com/ROLLPIX/M2-order-status-colors)[ RSS](/packages/rollpix-module-orderstatuscolor/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (1)Dependencies (1)Versions (2)Used By (0)

Magento 2 Order Status Color
============================

[](#magento-2-order-status-color)

[![Latest Stable Version](https://camo.githubusercontent.com/a0cfaf9af237577e55f3120250ab8ae7f427b48bb0eab792564f78f4c1de8418/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f726f6c6c7069782f6d6f64756c652d6f72646572737461747573636f6c6f722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/rollpix/module-orderstatuscolor)[![License](https://camo.githubusercontent.com/7ea796e4659ccec3e05db3af871e300287ed65cbf1142772f0e38736a2364d36/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f6c2f726f6c6c7069782f6d6f64756c652d6f72646572737461747573636f6c6f722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/rollpix/module-orderstatuscolor)[![Magento 2](https://camo.githubusercontent.com/80ac40e03ac79599119cdee6be7233eba1a7ac7ec08ce4732a688386b985ab42/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4d6167656e746f2d322e342e782d6f72616e67652e7376673f7374796c653d666c61742d737175617265)](https://magento.com)[![Mage-OS](https://camo.githubusercontent.com/89519aa839147f0b8bcd9bd5e5cf43b7d9be943cac35fd819ad97c99a0f973cb/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4d6167652d2d4f532d322e30253230253743253230322e312d626c75652e7376673f7374796c653d666c61742d737175617265)](https://mage-os.org)[![PHP](https://camo.githubusercontent.com/c5b3f6fae0d673a98b9fd21622e9e2feb8d2e8eeba8f9cc234848738fc173ddb/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f5048502d372e34253230253743253230382e30253230253743253230382e31253230253743253230382e32253230253743253230382e33253230253743253230382e342d707572706c652e7376673f7374796c653d666c61742d737175617265)](https://php.net)

A Magento 2 module that allows you to customize order status colors in the admin panel. Add visual color badges to order statuses for better order management and quick status identification.

**Developed by [Rollpix](https://rollpix.com)**

Features
--------

[](#features)

- **Visual Color Picker** - Easy-to-use color palette with 24 predefined colors + custom color picker
- **Color Column in Status Grid** - See all configured colors at a glance in Stores > Order Status
- **Colored Status Badges** - Order status displayed as colored badges in the Orders grid
- **Works with All Statuses** - Compatible with native Magento statuses and custom ones
- **Automatic Background** - Background color calculated automatically (15% opacity of main color)
- **No Core Modifications** - Uses plugins and layout XML, no core file changes
- **Mage-OS Compatible** - Fully compatible with Mage-OS distributions

Compatibility
-------------

[](#compatibility)

PlatformVersions**Magento Open Source**2.4.4, 2.4.5, 2.4.6, 2.4.7, 2.4.8**Adobe Commerce**2.4.4, 2.4.5, 2.4.6, 2.4.7, 2.4.8**Mage-OS**2.0.x, 2.1.x**PHP**7.4, 8.0, 8.1, 8.2, 8.3, 8.4Screenshots
-----------

[](#screenshots)

### Color Picker in Status Form

[](#color-picker-in-status-form)

The color picker includes a palette of predefined colors and a custom color picker for any HEX color.

### Orders Grid with Colored Badges

[](#orders-grid-with-colored-badges)

Order statuses are displayed as colored badges for quick visual identification.

### Order Status Grid with Color Column

[](#order-status-grid-with-color-column)

View all configured colors in the Order Status management grid.

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

[](#requirements)

- Magento 2.4.4+ / Mage-OS 2.0+
- PHP 7.4 or higher (including PHP 8.4)

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

[](#installation)

### Via Composer (Recommended)

[](#via-composer-recommended)

```
composer require rollpix/module-orderstatuscolor
```

### Enable the Module

[](#enable-the-module)

```
php bin/magento module:enable Rollpix_OrderStatusColor
php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy -f
php bin/magento cache:flush
```

### Manual Installation

[](#manual-installation)

1. Create directory `app/code/Rollpix/OrderStatusColor`
2. Download and extract the module files into that directory
3. Run the enable commands above

Configuration
-------------

[](#configuration)

### Setting Up Status Colors

[](#setting-up-status-colors)

1. Navigate to **Stores > Settings > Order Status** in the Magento Admin
2. Click on any existing status to edit, or create a new status
3. You will see a new **Status Color** field with:
    - A palette of 24 predefined colors (click to select)
    - A custom color picker for any color
    - A text field to enter HEX codes manually (e.g., `#FF5733`)
4. Select or enter your desired color
5. Click **Save Status**

### Viewing Colors

[](#viewing-colors)

- **Order Status Grid** (`Stores > Order Status`): A new "Color" column shows the configured color swatch and HEX code
- **Orders Grid** (`Sales > Orders`): The Status column displays colored badges

### Color Format

[](#color-format)

- Use 6-digit HEX format: `#RRGGBB` (e.g., `#FF5733`)
- 3-digit HEX is also supported: `#RGB` (e.g., `#F53`)
- Leave empty for default gray color (`#303030`)

Predefined Color Palette
------------------------

[](#predefined-color-palette)

The module includes 24 carefully selected colors:

ColorHEXUse CaseGreen`#2ECC71`Complete, SuccessBlue`#3498DB`Processing, In ProgressRed`#E74C3C`Cancelled, FailedOrange`#E67E22`Pending, On HoldYellow`#F1C40F`Warning, AttentionPurple`#9B59B6`Special, VIPGray`#7F8C8D`Closed, ArchivedTechnical Details
-----------------

[](#technical-details)

### Database Changes

[](#database-changes)

The module adds a `status_color` column (VARCHAR 7) to the `sales_order_status` table to store HEX color codes.

### Module Structure

[](#module-structure)

```
Rollpix/OrderStatusColor/
├── Block/
│   └── Adminhtml/Order/Status/Grid/Renderer/
│       └── Color.php                 # Renders color swatch in status grid
├── Model/
│   └── StatusColorProvider.php       # Provides status colors from database
├── Plugin/
│   ├── Block/Adminhtml/Order/Status/Edit/
│   │   └── Form.php                  # Adds color picker to status form
│   └── Controller/Adminhtml/Order/Status/
│       └── Save.php                  # Saves color when status is saved
├── ViewModel/
│   └── StatusColors.php              # Generates dynamic CSS for badges
├── etc/
│   ├── adminhtml/
│   │   └── di.xml                    # Plugin declarations
│   ├── db_schema.xml                 # Database schema
│   ├── db_schema_whitelist.json
│   └── module.xml                    # Module declaration
├── view/adminhtml/
│   ├── layout/
│   │   ├── sales_order_index.xml     # Adds CSS to orders grid
│   │   └── sales_order_status_index.xml  # Adds color column to status grid
│   ├── templates/
│   │   └── status-colors.phtml       # Dynamic CSS generation
│   ├── ui_component/
│   │   └── sales_order_grid.xml      # Custom status column component
│   └── web/
│       ├── css/
│       │   ├── source/_module.less   # Base badge styles
│       │   └── status-grid.css       # Status grid styles
│       ├── js/
│       │   ├── grid/columns/select.js    # Custom grid column
│       │   └── status-colors.js          # Color initialization
│       └── template/ui/grid/cells/
│           └── status.html           # Knockout template for badges
├── composer.json
├── registration.php
└── README.md

```

Troubleshooting
---------------

[](#troubleshooting)

### Colors not showing in Orders grid

[](#colors-not-showing-in-orders-grid)

1. Clear all caches: `php bin/magento cache:flush`
2. Deploy static content: `php bin/magento setup:static-content:deploy -f`
3. Clear browser cache

### Color picker not appearing in status form

[](#color-picker-not-appearing-in-status-form)

1. Recompile DI: `php bin/magento setup:di:compile`
2. Clear generated code: `rm -rf generated/code/*`
3. Flush cache: `php bin/magento cache:flush`

### Column not showing in Status grid

[](#column-not-showing-in-status-grid)

1. Clear layout cache: `php bin/magento cache:clean layout`
2. Clear full page cache: `php bin/magento cache:clean full_page`

Uninstallation
--------------

[](#uninstallation)

```
php bin/magento module:disable Rollpix_OrderStatusColor
composer remove rollpix/module-orderstatuscolor
php bin/magento setup:upgrade
php bin/magento cache:flush
```

Note: The `status_color` column will remain in the database. To remove it completely, run:

```
ALTER TABLE sales_order_status DROP COLUMN status_color;
```

Contributing
------------

[](#contributing)

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request

Support
-------

[](#support)

- **Issues**: [GitHub Issues](https://github.com/ROLLPIX/M2-order-status-colors/issues)
- **Email**:
- **Website**: [rollpix.com](https://rollpix.com)

License
-------

[](#license)

This module is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

Changelog
---------

[](#changelog)

### 1.0.0

[](#100)

- Initial release
- Color picker with 24 predefined colors
- Custom color picker support
- Color column in Order Status grid
- Colored badges in Orders grid
- Full compatibility with:
    - Magento 2.4.4 - 2.4.8
    - Mage-OS 2.0.x - 2.1.x
    - PHP 7.4 - 8.4

---

**Made with love by [Rollpix](https://rollpix.com)**

###  Health Score

33

—

LowBetter than 75% of packages

Maintenance78

Regular maintenance activity

Popularity3

Limited adoption so far

Community9

Small or concentrated contributor base

Maturity39

Early-stage or recently created project

 Bus Factor1

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

Unknown

Total

1

Last Release

114d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/2244b007d24a136b3d70c0daae65409d493f9ac5e3b6bd868858a907c924a4ed?d=identicon)[nmarquev](/maintainers/nmarquev)

---

Top Contributors

[![mateussantin](https://avatars.githubusercontent.com/u/40871048?v=4)](https://github.com/mateussantin "mateussantin (17 commits)")[![nmarquev](https://avatars.githubusercontent.com/u/20818155?v=4)](https://github.com/nmarquev "nmarquev (7 commits)")[![fredden](https://avatars.githubusercontent.com/u/334786?v=4)](https://github.com/fredden "fredden (4 commits)")

---

Tags

color pickermagento2Order Statusmagento 2ordermage-osadmin GridMagento 2.4status colorrollpix

### Embed Badge

![Health badge](/badges/rollpix-module-orderstatuscolor/health.svg)

```
[![Health](https://phpackages.com/badges/rollpix-module-orderstatuscolor/health.svg)](https://phpackages.com/packages/rollpix-module-orderstatuscolor)
```

###  Alternatives

[magepal/magento2-googletagmanager

Google Tag Manager (GTM) for Magento 2 with Advance Data Layer

2671.5M4](/packages/magepal-magento2-googletagmanager)[magepal/magento2-reindex

Reindex your Magento2 store quickly and easily from backend/admin, instead of command line.

112649.7k1](/packages/magepal-magento2-reindex)[mageplaza/magento-2-blog-extension

Magento 2 Blog extension

123708.2k5](/packages/mageplaza-magento-2-blog-extension)[magepal/magento2-customeraccountlinksmanager

Customer Account Links Manager for Magento2 allows you to quickly and easily remove unwanted links from customer account dashboard

4084.9k](/packages/magepal-magento2-customeraccountlinksmanager)[yireo/magento2-webp2

Magento 2 module to add WebP support to the Magento frontend

2091.2M7](/packages/yireo-magento2-webp2)[magepal/magento2-preview-checkout-success-page

Quickly and easily preview and test your Magento2 checkout success page, without placing a new order each time

7790.6k](/packages/magepal-magento2-preview-checkout-success-page)

PHPackages © 2026

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