Project Octopus (tailwind.config.js)

 avatar
unknown
css
5 months ago
1.9 kB
4
Indexable
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./week_2_projectoctopus/*.html"],
  theme: {
    extend: {
      fontFamily: {
        gilroy: ['Gilroy', 'sans-serif']
      },
      colors: {
        primary: {
          50: '#e6f2ff',
          100: '#b0d6ff',
          200: '#8ac2ff',
          300: '#55a7ff',
          400: '#3495ff',
          500: '#017bff',
          600: '#0170e8',
          700: '#0157b5',
          800: '#01448c',
          900: '#00346b',
        },
        secondary: {
            50: '#ebf9f9',
            100: '#c2ebee',
            200: '#a4e2e5',
            300: '#7ad5d9',
            400: '#61cdd2',
            500: '#39c0c7',
            600: '#34afb5',
            700: '#28888d',
            800: '#1f6a6d',
            900: '#185154',
        },
        text: {
            50: '#e8e9ea',
            100: '#b8bbbf',
            200: '#969b9f',
            300: '#666d74',
            400: '#495159',
            500: '#1b252f',
            600: '#19222b',
            700: '#131a21',
            800: '#0f141a',
            900: '#0b1014',
        },
        white: {
            50: '#ffffff',
            100: '#ffffff',
            200: '#ffffff',
            300: '#ffffff',
            400: '#ffffff',
            500: '#ffffff',
            600: '#e8e8e8',
            700: '#b5b5b5',
            800: '#8c8c8c',
            900: '#6b6b6b',
        },
      },
      spacing: {
        '75': '75px',
      },
      fontSize: {
        'h1': '3.812rem',   // 61px
        'h2': '3.062rem',   // 49px
        'h3': '2.438rem',   // 39px
        'h4': '1.938rem',   // 31px
        'h5': '1.562rem',   // 25px
        'h6': '1.25rem',    // 20px
        'body1': '1rem',    // 16px
        'body2': '0.812rem', // 13px
        'caption': '0.625rem' // 10px
      },
    },
  },
  plugins: [],
}

Editor is loading...
Leave a Comment