Matugen is a cross-platform tool that generates a colorscheme either from an image or a color, and exports it to a file from a template. It can also set the wallpaper if one was provided.
Material Design 3 offers a new color system that allows for more flexible and dynamic use of color. The new system includes a wider range of colors, as well as a range of tints and shades that can be used to create subtle variations in color.
Note Want a feature that is not listed above? Simply open an issue.
shell
cargo install matugen
Add matugen to your flake inputs:
nix
inputs = {
matugen = {
url = "github:/InioX/Matugen";
};
# ...
};
Then you can add it to your packages:
nix
let
system = "x86_64-linux";
in {
environment.systemPackages = with pkgs; [
# ...
inputs.matugen.packages.${system}.default
];
}
shell
pkgin install matugen
or, if you prefer to build it from source
shell
cd /usr/pkgsrc/graphics/matugen
make install
Light | Dark | Amoled |
![]() |
![]() |
![]() |
Default | Triadic | Adjacent |
![]() |
![]() |
![]() |
sh
matugen -h
matugen --help
sh
matugen --show-colors <other-arguments>
sh
matugen -v <other-arguments>
```sh
matugen image /path/to/wallpaper/ -m "dark"
matugen image /path/to/wallpaper/ -m "light"
matugen image /path/to/wallpaper/ -m "amoled"
Example:
sh
matugen image ~/wall/snow.png -l
```
```sh
matugen color hsl
matugen color hex
matugen color rgb
Example:
sh
matugen color hex "#ffbf9b"
matugen color rgb "rgb(63, 106, 171)" -m "light"
matugen color hsl "hsl(216.34, 45.75%, 45.88%)" -m "amoled"
```
The basic syntax for using colors is prefix + {color}
(The default prefix is @
, so the usage would be @{color}
).
```css @define-color primary @{primary}; /* Result: #ffb783 / @define-color primary @{primary.hex}; / Result: #ffb783 / @define-color primary @{primary.rgb}; / Result: rgb(255, 183, 131) / @define-color primary @{primary.rgba}; / Result: rgba(255, 183, 131, 255) / @define-color primary @{primary.strip}; / Result: ffb783 */
```
You can get the source color (color used for generating colorscheme) by using:
css
@import url("@{source_color}"); /* Result: #ffb783*/
You can also get the image (if it was provided) by using:
css
@import url("@{image}"); /* Result: /home/ini/Downloads/wallpaper.jpg */
Note If no image was provided, Matugen will just skip over the image keyword
```css /colors.css/ @define-color primary @{primary}; @define-color onprimary @{onprimary}; @define-color primarycontainer @{primarycontainer}; @define-color onprimarycontainer @{onprimarycontainer}; @define-color secondary @{secondary}; @define-color onsecondary @{onsecondary}; @define-color secondarycontainer @{secondarycontainer}; @define-color onsecondarycontainer @{onsecondarycontainer}; @define-color tertiary @{tertiary}; @define-color ontertiary @{ontertiary}; @define-color tertiarycontainer @{tertiarycontainer}; @define-color ontertiarycontainer @{ontertiarycontainer}; @define-color error @{error}; @define-color onerror @{onerror}; @define-color errorcontainer @{errorcontainer}; @define-color onerrorcontainer @{onerrorcontainer}; @define-color background @{background}; @define-color onbackground @{onbackground}; @define-color surface @{surface}; @define-color onsurface @{onsurface}; @define-color surfacevariant @{surfacevariant}; @define-color onsurfacevariant @{onsurfacevariant}; @define-color outline @{outline}; @define-color shadow @{shadow}; @define-color scrim @{scrim}; @define-color inversesurface @{inversesurface}; @define-color inverseonsurface @{inverseonsurface}; @define-color inverseprimary @{inverseprimary};
@define-color sourcecolor @{sourcecolor}; @define-color coloraccentprimary @{coloraccentprimary}; @define-color coloraccentprimaryvariant @{coloraccentprimaryvariant}; @define-color coloraccentsecondary @{coloraccentsecondary}; @define-color coloraccentsecondaryvariant @{coloraccentsecondaryvariant}; @define-color coloraccenttertiary @{coloraccenttertiary}; @define-color coloraccenttertiaryvariant @{coloraccenttertiaryvariant}; @define-color textcolorprimary @{textcolorprimary}; @define-color textcolorsecondary @{textcolorsecondary}; @define-color textcolortertiary @{textcolortertiary}; @define-color textcolorprimaryinverse @{textcolorprimaryinverse}; @define-color textcolorsecondaryinverse @{textcolorsecondaryinverse}; @define-color textcolortertiaryinverse @{textcolortertiaryinverse}; @define-color colorbackground @{colorbackground}; @define-color colorbackgroundfloating @{colorbackgroundfloating}; @define-color colorsurface @{colorsurface}; @define-color colorsurfacevariant @{colorsurfacevariant}; @define-color colorsurfacehighlight @{colorsurfacehighlight}; @define-color surfaceheader @{surfaceheader}; @define-color undersurface @{undersurface}; @define-color offstate @{offstate}; @define-color accentsurface @{accentsurface}; @define-color textprimaryonaccent @{textprimaryonaccent}; @define-color textsecondaryonaccent @{textsecondaryonaccent}; @define-color volumebackground @{volumebackground}; @define-color scrimandroid @{scrimandroid}; ```
Here is a list of different locations for the configuration file:
- Windows: C:\Users\user\AppData\Roaming\InioX\matugen\config\config.toml
- Linux: /home/user/.config/matugen/config.toml
- MacOS: /Users/user/Library/Application Support/com.InioX.matugen/config.toml
Note You can also use a custom configuration path by using the
-c
argument
| Name | Type | Default | Description |
|----------------------|---------------|-----------|-------------------------------------------------------------------------------------------------|
| reloadapps | bool | false | Whether to reload apps. |
| setwallpaper | bool | false | Whether to set the wallpaper (if true
, requires wallpaper_tool
to be set). |
| wallpapertool | String | None | The wallpaper tool to use (Swwww
, Swaybg
, Feh
, Nitrogen
). |
| prefix | String | "@" | The prefix to use (for example: @{primary}
) |
| ~~reloadgtktheme~~ | ~~bool~~ | ~~false~~ | ~~Whether to reload the gtk theme.~~ REMOVED, USE gtk_theme
in config.reload_apps_list
. |
| runafter | Vec
| Name | Type | Default | Description | |-----------|------|---------|----------------------------------| | kitty | bool | true | Whether to reload kitty. | | waybar | bool | true | Whether to reload waybar. | | dunst | bool | true | Whether to reload dunst. | | gtk_theme | bool | true | Whether to reload the GTK theme. |
```toml
[config] reloadapps = true setwallpaper = true wallpapertool = 'Swww' prefix = '@' swwwoptions = [ "--transition-type", "center", ] run_after = [ [ "echo", "'hello'" ], [ "echo", "'hello again'" ], ]
[config.reloadappslist] waybar = true kitty = true gtk_theme = true dunst = true ```
| Name | Type | Default | Description |
|-----------------|-----------------------|---------------------------|-----------------------------------------|
| mode | Option\
Note The
mode
key will override the mode specified in the arguments, only for that template.
For all available modes, look at the usage.
```toml
[templates.test] # First way of adding template inputpath = '~/.config/example/template.css' outputpath = '~/.config/example' mode = "Light" # First letter MUST be upper-case
[templates] # Another way test2 = { inputpath = '~/.config/example/template2.css', outputpath = '~/.config/example2' } ```