Matugen


Crates.io Crates.io
Installation · Usage · Configuration
A cross-platform material you color generation tool

Description

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.

About Material Design 3

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.

Other projects

Supported platforms

Roadmap

Note Want a feature that is not listed above? Simply open an issue.

Installation

Cargo

shell cargo install matugen

NixOS

Add matugen to your flake inputs: nix inputs = { matugen = { url = "github:/InioX/Matugen"; # If you need a specific version: ref = "refs/tags/matugen-v0.10.0" }; # ... };

Then you can add it to your packages: nix let system = "x86_64-linux"; in { environment.systemPackages = with pkgs; [ # ... inputs.matugen.packages.${system}.default ]; }

NetBSD

shell pkgin install matugen or, if you prefer to build it from source shell cd /usr/pkgsrc/graphics/matugen make install

Usage

Modes

Light Dark Amoled

Palettes

Default Triadic Adjacent

Json flag

Allows for dumping the schemes similarly to --show-colors, but in a machine-readable format. Can dump hex, rgba, hsl, etc.

Result

```json { "colors": { "amoled": { "background": "#000000", "error": "#ffb4ab", "error_container": "#93000a", "inverse_on_surface": "#323032", "inverse_primary": "#72518b", "inverse_surface": "#e7e1e4", "on_background": "#e7e1e4", "on_error": "#690005", "on_error_container": "#ffb4ab", "on_primary": "#412259", "on_primary_container": "#f2daff", "on_secondary": "#362d3b", "on_secondary_container": "#ecdef1", "on_surface": "#e7e1e4", "on_surface_variant": "#ccc4cc", "on_tertiary": "#47282a", "on_tertiary_container": "#ffdadb", "outline": "#958f96", "outline_variant": "#4a454c", "primary": "#dfb8fa", "primary_container": "#593972", "scrim": "#000000", "secondary": "#cfc2d4", "secondary_container": "#4d4352", "shadow": "#000000", "source_color": "#bb96d6", "surface": "#000000", "surface_variant": "#131015", "tertiary": "#ebbbbd", "tertiary_container": "#603d40" }, "dark": { "background": "#1d1b1d", "error": "#ffb4ab", "error_container": "#93000a", "inverse_on_surface": "#323032", "inverse_primary": "#72518b", "inverse_surface": "#e7e1e4", "on_background": "#e7e1e4", "on_error": "#690005", "on_error_container": "#ffb4ab", "on_primary": "#412259", "on_primary_container": "#f2daff", "on_secondary": "#362d3b", "on_secondary_container": "#ecdef1", "on_surface": "#e7e1e4", "on_surface_variant": "#ccc4cc", "on_tertiary": "#47282a", "on_tertiary_container": "#ffdadb", "outline": "#958f96", "outline_variant": "#4a454c", "primary": "#dfb8fa", "primary_container": "#593972", "scrim": "#000000", "secondary": "#cfc2d4", "secondary_container": "#4d4352", "shadow": "#000000", "source_color": "#bb96d6", "surface": "#1d1b1d", "surface_variant": "#4a454c", "tertiary": "#ebbbbd", "tertiary_container": "#603d40" }, "light": { "background": "#fffbff", "error": "#ba1a1a", "error_container": "#ffdad6", "inverse_on_surface": "#f5eff2", "inverse_primary": "#dfb8fa", "inverse_surface": "#323032", "on_background": "#1d1b1d", "on_error": "#ffffff", "on_error_container": "#410002", "on_primary": "#ffffff", "on_primary_container": "#2a0a43", "on_secondary": "#ffffff", "on_secondary_container": "#201926", "on_surface": "#1d1b1d", "on_surface_variant": "#4a454c", "on_tertiary": "#ffffff", "on_tertiary_container": "#2e1316", "outline": "#7b757c", "outline_variant": "#ccc4cc", "primary": "#72518b", "primary_container": "#f2daff", "scrim": "#000000", "secondary": "#655b6a", "secondary_container": "#ecdef1", "shadow": "#000000", "source_color": "#bb96d6", "surface": "#fffbff", "surface_variant": "#e9e0e8", "tertiary": "#7a5557", "tertiary_container": "#ffdadb" } }, "colors_android": { "amoled": { "accent_surface": "#fbecff", "color_accent_primary": "#f2daff", "color_accent_primary_variant": "#c29ddd", "color_accent_secondary": "#ecdef1", "color_accent_secondary_variant": "#b4a7b9", "color_accent_tertiary": "#ffdadb", "color_accent_tertiary_variant": "#cda0a3", "color_background": "#000000", "color_background_floating": "#000000", "color_surface": "#121013", "color_surface_highlight": "#1d1b1d", "color_surface_variant": "#272528", "off_state": "#323032", "scrim_android": "#cac5c8", "surface_header": "#1d1b1d", "text_color_primary": "#f5eff2", "text_color_primary_inverse": "#1d1b1d", "text_color_secondary": "#ccc4cc", "text_color_secondary_inverse": "#494649", "text_color_tertiary": "#958f96", "text_color_tertiary_inverse": "#7a7679", "text_primary_on_accent": "#1d1b1d", "text_secondary_on_accent": "#4a454c", "under_surface": "#000000", "volume_background": "#000000" }, "dark": { "accent_surface": "#fbecff", "color_accent_primary": "#f2daff", "color_accent_primary_variant": "#c29ddd", "color_accent_secondary": "#ecdef1", "color_accent_secondary_variant": "#b4a7b9", "color_accent_tertiary": "#ffdadb", "color_accent_tertiary_variant": "#cda0a3", "color_background": "#1d1b1d", "color_background_floating": "#1d1b1d", "color_surface": "#323032", "color_surface_highlight": "#555154", "color_surface_variant": "#494649", "off_state": "#323032", "scrim_android": "#cac5c8", "surface_header": "#494649", "text_color_primary": "#f5eff2", "text_color_primary_inverse": "#1d1b1d", "text_color_secondary": "#ccc4cc", "text_color_secondary_inverse": "#494649", "text_color_tertiary": "#958f96", "text_color_tertiary_inverse": "#7a7679", "text_primary_on_accent": "#1d1b1d", "text_secondary_on_accent": "#4a454c", "under_surface": "#000000", "volume_background": "#3d3a3d" }, "light": { "accent_surface": "#fbecff", "color_accent_primary": "#f2daff", "color_accent_primary_variant": "#72518b", "color_accent_secondary": "#ecdef1", "color_accent_secondary_variant": "#655b6a", "color_accent_tertiary": "#ffdadb", "color_accent_tertiary_variant": "#7a5557", "color_background": "#f5eff2", "color_background_floating": "#fef8fb", "color_surface": "#fef8fb", "color_surface_highlight": "#ffffff", "color_surface_variant": "#e7e1e4", "off_state": "#323032", "scrim_android": "#cac5c8", "surface_header": "#e7e1e4", "text_color_primary": "#1d1b1d", "text_color_primary_inverse": "#f5eff2", "text_color_secondary": "#4a454c", "text_color_secondary_inverse": "#cac5c8", "text_color_tertiary": "#7b757c", "text_color_tertiary_inverse": "#948f93", "text_primary_on_accent": "#1d1b1d", "text_secondary_on_accent": "#4a454c", "under_surface": "#000000", "volume_background": "#3d3a3d" } } } ```

sh matugen --json <JSON> <other-arguments>

Help

sh matugen -h matugen --help

Show colors

sh matugen --show-colors <other-arguments>

Verbose mode

sh matugen -v <other-arguments>

Generate from an image

```sh

Dark mode

matugen image /path/to/wallpaper/ -m "dark"

Light mode

matugen image /path/to/wallpaper/ -m "light"

AMOLED/"pure dark" mode

matugen image /path/to/wallpaper/ -m "amoled"

Example: sh matugen image ~/wall/snow.png -l ```

Generate from a color

```sh

Dark mode

matugen color hsl -m "dark"

Light mode

matugen color hex -m "light"

AMOLED/"pure dark" mode

matugen color rgb -m "amoled" 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" ```

Creating templates

The basic syntax for using colors is prefix + {color} (The default prefix is @, so the usage would be @{color}).

Keywords

If you want a specific scheme, you can use @{primary.light.hex}. All available modes/schemes can be found here.

```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 / @define-color primary @{primary.hsl}; / Result: hsl(25, 100%, 76%) / @define-color primary @{primary.hsla}; / Result: hsla(242.2, 49.4%, 67.45%, 1) */

@define-color primary @{background.light.hex}; /* Result: #fffbff / @define-color primary @{background.dark.hex}; / Result: #1e1b19 / @define-color primary @{background.amoled.hex}; / Result: #000000 */ ```

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

Example of all the color keywords:

```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}; ```

Configuration

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

Configuration items

| 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 | [] | The commands to run after the templates have been generated. | | swwwoptions | > | [] | The options to use for Swwww | | fehoptions | > | [] | The options to use for Feh |

Apps

| 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. |

Example

```toml

config_directory/config.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 ```

Adding templates

| Name | Type | Default | Description | |-----------------|-----------------------|---------------------------|-----------------------------------------| | mode | Option\path | PathBuf | None | Path to the template file. | | outputpath | PathBuf | None | Path to export the template to. |

Modes

Note The mode key will override the mode specified in the arguments, only for that template.

For all available modes, look at the usage.

Example

```toml

config_directory/config.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' } ```

Acknowledgment