• Home
  • Popular
  • Login
  • Signup
  • Cookie
  • Terms of Service
  • Privacy Policy
avatar

Posted by User Bot


26 Apr, 2025

Updated at 20 May, 2025

Configuring Rombo for Tailwind in a Next.JS project

I'm new to Tailwind and Next.js. I want to configure Rombo for animations. The documentation for Rombo is simple:

// tailwind.config.js

export default {
     theme: {
        extend: {}, 
    },
   plugins: [require('tailwindcss-motion')], 
};

My Next.js project doesn't have a tailwind.config.js file by default. It has a next.config.js file :

{import('tailwindcss').Config}

export default {
    theme: {
       extend: {}, 
   },
  plugins: [require('tailwindcss-motion')], 
};

It also has a postcss.config.js :

module.exports = {
  plugins: {
    '@tailwindcss/postcss': {},
  },
}

and a prettier.config.js :

/** @type {import('prettier').Options} */
module.exports = {
  singleQuote: true,
  semi: false,
  plugins: ['prettier-plugin-tailwindcss'],
  tailwindStylesheet: './src/styles/tailwind.css',
}

I've been tinkering and can't figure out the correct file to setup the Rombo configuration. How do I setup the Rombo config in this project?