Plumeria logo/ ✾ Plumeria
API reference

color

color object

colors

Provides a color set from an object that is supplied with autocomplete.

themeColors

Provides a set of common framework colors. eg: error success.

lighten darken

Mixes dark or light in the proportion specified by the second argument. Returns: <color>

export const color = {
  ...colors,
  ...themeColors,
  lighten,
  darken,
};

colors

const colors = {
  ...
  wheat: 'wheat',
  white: 'white',
  whitesmoke: 'whitesmoke',
  yellow: 'yellow',
  yellowgreen: 'yellowgreen',
}

themeColors

const themeColors = {
  primary: '#0070f3',
  secondary: '#ff4081',
  success: '#2e7d32',
  warning: '#ed6c02',
  error: '#d32f2f',
}

lighten darken

TypeScript
import { css } from '@plumeria/core';
 
const styles = css.create({
  dark_text: {
    color: css.color.darken('navy', 0.2),
  },
  light_text: {
    color: css.color.lighten('navy', 0.8),
  },
});

See more about @plumeria/collection package

Edit on GitHub

Previous

pseudo

Next

ServerCSS

On this page

;