archive-gh-me/tailwindcss
1
0
Fork 0
mirror of https://github.com/tailwindlabs/tailwindcss.git synced 2025-12-08 21:36:08 +00:00
Code Issues Projects Releases Wiki Activity
tailwindcss/src/defaultConfig.js
Adam Wathan daaf1cadce Provide fewer default text color utilities 
Provide just the dark and darker versions of each color. We may want to
add one light option too?
2017-10-16 13:51:01 -04:00

384 lines
10 KiB
JavaScript
Raw Blame History

var colors = {
'black': '#000000',
'grey-900': '#212b35',
'grey-800': '#404e5c',
'grey-700': '#647382',
'grey-600': '#919eab',
'grey-500': '#c5ced6',
'grey-400': '#dfe3e8',
'grey-300': '#f0f2f5',
'grey-200': '#f7f9fa',
'white': '#ffffff',
'red-darker': '#960f0d',
'red-dark': '#d43633',
'red': '#f25451',
'red-light': '#fa8785',
'red-lightest': '#fff1f0',
'orange-darker': '#875200',
'orange-dark': '#f29500',
'orange': '#ffb82b',
'orange-light': '#ffd685',
'orange-lightest': '#fff8eb',
'yellow-darker': '#966100',
'yellow-dark': '#ffc400',
'yellow': '#ffe14a',
'yellow-light': '#ffea83',
'yellow-lightest': '#fffbe5',
'green-darker': '#056619',
'green-dark': '#34ae4c',
'green': '#57d06f',
'green-light': '#b1f3be',
'green-lightest': '#eefff1',
'teal-darker': '#025654',
'teal-dark': '#249e9a',
'teal': '#4dc0b5',
'teal-light': '#9eebe4',
'teal-lightest': '#e8fdfa',
'blue-darker': '#154267',
'blue-dark': '#3687c8',
'blue': '#4aa2ea',
'blue-light': '#acdaff',
'blue-lightest': '#f1f9ff',
'indigo-darker': '#242b54',
'indigo-dark': '#4957a5',
'indigo': '#6574cd',
'indigo-light': '#bcc5fb',
'indigo-lightest': '#f4f5ff',
'purple-darker': '#331f56',
'purple-dark': '#714cb4',
'purple': '#976ae6',
'purple-light': '#ceb3ff',
'purple-lightest': '#f7f3ff',
'pink-darker': '#6b2052',
'pink-dark': '#d84f7d',
'pink': '#f66d9b',
'pink-light': '#ffa5c3',
'pink-lightest': '#fdf2f5',
}
module.exports = {
colors: colors,
screens: {
sm: '576px',
md: '768px',
lg: '992px',
xl: '1200px',
},
text: {
fonts: {
'sans': '-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue',
'serif': 'Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif',
'mono': 'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace',
},
sizes: {
'base': '1rem', // 16px
'xs': '.75rem', // 12px
'sm': '.875rem', // 14px
'md': '1rem', // 16px
'lg': '1.125rem', // 18px
'xl': '1.25rem', // 20px
'2xl': '1.75rem', // 28px
'3xl': '2.375rem', // 38px
'4xl': '2.875rem', // 46px
},
weights: {
'hairline': 200,
'thin': 300,
'regular': 400,
'medium': 600,
'bold': 700,
},
leading: {
'none': 1,
'tight': 1.25,
'normal': 1.5,
'loose': 2,
},
tracking: {
'tight': '-0.05em',
'normal': '0',
'wide': '0.1em',
},
colors: {
'light': colors['white'],
'light-soft': 'rgba(255,255,255,.6)',
'light-softer': 'rgba(255,255,255,.45)',
'light-softest': 'rgba(255,255,255,.35)',
'dark': colors['grey-900'],
'dark-soft': colors['grey-700'],
'dark-softer': colors['grey-600'],
'dark-softest': colors['grey-500'],
'red-dark': colors['red-darker'],
'red': colors['red-dark'],
'orange-dark': colors['orange-darker'],
'orange': colors['orange-dark'],
'yellow-dark': colors['yellow-darker'],
'yellow': colors['yellow-dark'],
'green-dark': colors['green-darker'],
'green': colors['green-dark'],
'teal-dark': colors['teal-darker'],
'teal': colors['teal-dark'],
'blue-dark': colors['blue-darker'],
'blue': colors['blue-dark'],
'indigo-dark': colors['indigo-darker'],
'indigo': colors['indigo-dark'],
'purple-dark': colors['purple-darker'],
'purple': colors['purple-dark'],
'pink-dark': colors['pink-darker'],
'pink': colors['pink-dark'],
},
},
backgrounds: {
colors: {
'light': colors['white'],
'light-soft': colors['grey-200'],
'light-softer': colors['grey-300'],
'light-softest': colors['grey-400'],
'dark': colors['grey-900'],
'dark-soft': colors['grey-800'],
'dark-softer': colors['grey-700'],
'dark-softest': colors['grey-600'],
'red-dark': colors['red-dark'],
'red': colors['red'],
'red-light': colors['red-light'],
'red-lightest': colors['red-lightest'],
'orange-dark': colors['orange-dark'],
'orange': colors['orange'],
'orange-light': colors['orange-light'],
'orange-lightest': colors['orange-lightest'],
'yellow-dark': colors['yellow-dark'],
'yellow': colors['yellow'],
'yellow-light': colors['yellow-light'],
'yellow-lightest': colors['yellow-lightest'],
'green-dark': colors['green-dark'],
'green': colors['green'],
'green-light': colors['green-light'],
'green-lightest': colors['green-lightest'],
'teal-dark': colors['teal-dark'],
'teal': colors['teal'],
'teal-light': colors['teal-light'],
'teal-lightest': colors['teal-lightest'],
'blue-dark': colors['blue-dark'],
'blue': colors['blue'],
'blue-light': colors['blue-light'],
'blue-lightest': colors['blue-lightest'],
'indigo-dark': colors['indigo-dark'],
'indigo': colors['indigo'],
'indigo-light': colors['indigo-light'],
'indigo-lightest': colors['indigo-lightest'],
'purple-dark': colors['purple-dark'],
'purple': colors['purple'],
'purple-light': colors['purple-light'],
'purple-lightest': colors['purple-lightest'],
'pink-dark': colors['pink-dark'],
'pink': colors['pink'],
'pink-light': colors['pink-light'],
'pink-lightest': colors['pink-lightest'],
}
},
borders: {
defaults: {
width: '1px',
color: colors['grey-500'],
},
widths: {
'0': '0',
'2': '2px',
'4': '4px',
'8': '8px',
},
rounded: {
default: '.25rem',
modifiers: {
sm: '.125rem',
lg: '.5rem',
pill: '9999px',
}
},
colors: {
'transparent': 'transparent',
'light-overlay': 'hsla(0,0%,0%,.2)',
'light-overlay-soft': 'hsla(0,0%,0%,.1)',
'light-overlay-softer': 'hsla(0,0%,0%,.05)',
'dark-overlay': 'hsla(0,0%,100%,1)',
'dark-overlay-soft': 'hsla(0,0%,100%,.6)',
'dark-overlay-softer': 'hsla(0,0%,100%,.35)',
'light': colors['white'],
'light-soft': colors['grey-200'],
'light-softer': colors['grey-300'],
'dark': colors['grey-600'],
'dark-soft': colors['grey-500'],
'dark-softer': colors['grey-400'],
'red-dark': colors['red-dark'],
'red': colors['red'],
'red-light': colors['red-light'],
'red-lightest': colors['red-lightest'],
'orange-dark': colors['orange-dark'],
'orange': colors['orange'],
'orange-light': colors['orange-light'],
'orange-lightest': colors['orange-lightest'],
'yellow-dark': colors['yellow-dark'],
'yellow': colors['yellow'],
'yellow-light': colors['yellow-light'],
'yellow-lightest': colors['yellow-lightest'],
'green-dark': colors['green-dark'],
'green': colors['green'],
'green-light': colors['green-light'],
'green-lightest': colors['green-lightest'],
'teal-dark': colors['teal-dark'],
'teal': colors['teal'],
'teal-light': colors['teal-light'],
'teal-lightest': colors['teal-lightest'],
'blue-dark': colors['blue-dark'],
'blue': colors['blue'],
'blue-light': colors['blue-light'],
'blue-lightest': colors['blue-lightest'],
'indigo-dark': colors['indigo-dark'],
'indigo': colors['indigo'],
'indigo-light': colors['indigo-light'],
'indigo-lightest': colors['indigo-lightest'],
'purple-dark': colors['purple-dark'],
'purple': colors['purple'],
'purple-light': colors['purple-light'],
'purple-lightest': colors['purple-lightest'],
'pink-dark': colors['pink-dark'],
'pink': colors['pink'],
'pink-light': colors['pink-light'],
'pink-lightest': colors['pink-lightest'],
}
},
sizing: {
width: {
'auto': 'auto',
'px': '1px',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'24': '6rem',
'32': '8rem',
'48': '12rem',
'64': '16rem',
'1/2': '50%',
'1/3': '33.33333%',
'2/3': '66.66667%',
'1/4': '25%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.66667%',
'5/6': '83.33333%',
'full': '100%',
'screen': '100vw'
},
height: {
'auto': 'auto',
'px': '1px',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'24': '6rem',
'32': '8rem',
'48': '12rem',
'64': '16rem',
'full': '100%',
'screen': '100vh'
},
minHeight: {
'0': '0',
'full': '100%',
'screen': '100vh'
},
maxHeight: {
'full': '100%',
'screen': '100vh'
},
minWidth: {
'0': '0',
'full': '100%',
},
maxWidth: {
'xs': '20rem',
'sm': '30rem',
'md': '40rem',
'lg': '50rem',
'xl': '60rem',
'2xl': '70rem',
'3xl': '80rem',
'4xl': '90rem',
'5xl': '100rem',
'full': '100%',
},
},
spacing: {
padding: {
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'6': '1.5rem',
'8': '2rem',
},
margin: {
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'6': '1.5rem',
'8': '2rem',
},
negativeMargin: {
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'6': '1.5rem',
'8': '2rem',
},
},
shadows: {
'1': '0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.15)',
'2': '0 3px 6px rgba(0,0,0,.12), 0 3px 6px rgba(0,0,0,.13)',
'3': '0 10px 20px rgba(0,0,0,.13), 0 6px 6px rgba(0,0,0,.13)',
'4': '0 14px 28px rgba(0,0,0,.16), 0 10px 10px rgba(0,0,0,.11)',
'5': '0 19px 38px rgba(0,0,0,.18), 0 15px 12px rgba(0,0,0,.11)',
'inner': 'inset 0 1px 2px rgba(0, 0, 0, 0.05)',
'none': 'none',
},
zIndex: {
'0': 0,
'10': 10,
'20': 20,
'30': 30,
'40': 40,
'50': 50,
'auto': 'auto',
},
opacity: {
'0': '0',
'25': '.25',
'50': '.5',
'75': '.75',
'100': '1',
}
}
Reference in New Issue View Git Blame Copy Permalink