twin-moon-color/readme.md

Generate dark or light color automatically for MUI

### Features

- Create object for mui create theme
- Generate dark or light color automatically for MUI
- Support RGB, HSL, HEX and known colors

## how to use

```
...
import tmc from "twin-moon-color"

let themes = tmc({primary:"#000000"})
//or
//let themes = tmc({"text.primary":"!#000000", "background.default":"#ffffff"})
// the "!" will put the darker color in light theme and vise versa, made for contrast
//or
//let themes = tmc({text:{primary:"#000000", secondary:"#ffffff"}})

const app = ()=>{
    return (
        <ThemeProvider theme={isDarkTheme ? createTheme(themes.dark) : createTheme(themes.light)}>
        </ThemeProvider>
    )
}
```

or

```
...
import tmc from "twin-moon-color"

let themes = tmc({"text.primary":"#000000", "background.default":"#ffffff"})

const app = ()=>{
    return (
        <ThemeProvider theme={isDarkTheme ? createTheme(themes.dark) : createTheme(themes.light)}>
        </ThemeProvider>
    )
}
```

## supported format examples

```
let themes = tmc({primary:"#000000"})
let themes = tmc({primary:"black"})
let themes = tmc({primary:"!black"})
let themes = tmc({"text.primary":"#000000",})
let themes = tmc({primary:{main:"#000000",}})
let themes = tmc({"text.primary":"!#000000",}) // will invert the color
let themes = tmc({primary:[0,0,0]})//RGB
let themes = tmc({primary:["!", 0,0,0]})//RGB invert color
let themes = tmc({primary:["h", 0,0,0]})//HSL invert color
let themes = tmc({primary:["!h", 0,0,0]})//HSL invert color
let themes = tmc({primary:"*#000000"})//will put the same color in dark light theme
```

## how to use createDarkLightColors

```
...
import {createDarkLightColors} from "twin-moon-color"

let colors = createDarkLightColors("#00FF00");

const light = {
  palette: {
    mode: "light",
    primary: {
        main: colors.light
    }
  },
};

const dark = {
  palette: {
    mode: "dark",
    primary: {
        main: colors.dark
    }
  },
};

const app = ()=>{
    return (
        <ThemeProvider theme={isDarkTheme ? createTheme(dark) : createTheme(light)}>
        </ThemeProvider>
    )
}
```

## changes

- 0.0.6:

  - add \* to set the same color in dark and light theme

- 0.0.5:

  - more bug fixing

- 0.0.4:

  - add support for rgb, hsl, known colors
  - fix bug when using multi "something.something" format

- 0.0.3:

  - add palette text etc.
  - add "!" before color and it will put the darker color in light theme and vise versa

- 0.0.2:

  - create object for mui create theme

- 0.0.1:

  - createDarkLightColors