@mskcc/themes

> Dark / light mode theming for MSK digital products.

Installation

``bash
npm install @mskcc/themes
`

Usage

Add the following to your application.

> Note: For explicit control on the dark and light theme, turn $system-dark-mode to false.
> @use '@mskcc/themes' with ($system-dark-mode: false)

`scss
@use '@mskcc/themes';
`

`css
@import '@mskcc/themes/dist/themes.css';
`

`html
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@mskcc/themes@latest/dist/themes.css"
/>
`

$3

`tsx
import { lightTheme, darkTheme } from '@mskcc/themes';

const style = {
bg: lightTheme.colorBg,
};
`

$3

You can also use the tokens directly in your scss and css stylesheets.

`scss
@use '@mskcc/themes/tokens' as tk;

body {
background-color: tk.$msk--color-bg;
}
`

`css
body {
background-color: var(--msk-color-bg);
}
``