デフォルトのみ

import defaultTheme from 'tailwindcss/defaultTheme';

たとえば、ブレークポイントはlgまででいいな、って時に。

import defaultTheme from 'tailwindcss/defaultTheme'

export default {
  screens: {
    sm: defaultTheme.screens.sm,
    md: defaultTheme.screens.md,
    lg: defaultTheme.screens.lg,
  }
}

tailwind.config.jsの設定も込みで

import loadConfig from 'tailwindcss/loadConfig';
import resolveConfig from 'tailwindcss/resolveConfig';

const twConfig = resolveConfig(
  loadConfig(`${process.env.PWD}/tailwind.config.js`)
);
console.log(twConfig.theme.colors);

たとえば、postcss-inline-svgでfill属性を動的に変える時に、postcss-simple-varsを併用してTailwind CSSの変数を渡すことができます。

const loadConfig = require('tailwindcss/loadConfig');
const resolveConfig = require('tailwindcss/resolveConfig');
const twConfig = resolveConfig(
  loadConfig(`${process.env.PWD}/tailwind.config.js`)
);
const colors = {};
for (const i of Object.keys(twConfig.theme.colors)) {
  for (const j of Object.keys(twConfig.theme.colors[i])) {
    colors[`color-${i}${j !== 'DEFAULT' ? `-${j}` : ''}`] =
      twConfig.theme.colors[i][j];
  }
}

const config = {
  plugins: [
    require('postcss-simple-vars')({
      variables: { ...colors },
    }),
    require('postcss-inline-svg')({
      removeFill: true,
    }),
  ],
};

module.exports = config;

このコードはtheme.colorsが2階層であること前提なので、実際に使う場合はよしなにしてください。

ちなみに、実際にCSSを書くとこんな感じです。

background-image: svg-load('../images/icon_arrow.svg', fill: $color-primary);