forked from jmagrippis/emoji-of-the-x
-
Notifications
You must be signed in to change notification settings - Fork 0
/
tailwind.config.cjs
43 lines (42 loc) · 1.09 KB
/
tailwind.config.cjs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
const colors = require('tailwindcss/colors')
const withAlphaValue = (varName) => `hsl(var(--${varName}) / <alpha-value>)`
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ['./src/**/*.{html,js,ts,svelte}'],
theme: {
colors: {
primary: colors.emerald,
secondary: colors.orange,
copy: {
base: withAlphaValue('copy-base-color'),
muted: withAlphaValue('copy-muted-color'),
},
surface: {
1: withAlphaValue('surface-1-color'),
2: withAlphaValue('surface-2-color'),
3: withAlphaValue('surface-3-color'),
},
emphasis: {
DEFAULT: withAlphaValue('emphasis-color'),
hover: withAlphaValue('emphasis-hover-color'),
},
gray: colors.stone,
white: colors.white,
transparent: 'transparent',
current: 'currentColor',
},
boxShadow: {
low: 'var(--shadow-elevation-low)',
mid: 'var(--shadow-elevation-medium)',
high: 'var(--shadow-elevation-high)',
},
container: {
center: true,
},
fontFamily: {
sans: ['Alef', 'sans-serif', '"Noto Color Emoji"'],
},
extend: {},
},
plugins: [require('@tailwindcss/forms')],
}