cra - tailwindcss적용

//index.css
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  @font-face {
    font-family: "Dovemayo_wild";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302@1.0/Dovemayo_wild.woff2")
      format("woff2");
    font-weight: normal;
    font-style: normal;
  }
}

index.css에 layer 적용

//tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{js,jsx,ts,tsx}"],
  theme: {
    extend: {
      fontFamily: {
        Dovemayo_wild: ['"Dovemayo_wild"', "sans-serif"],
      },
    },
  },
  plugins: [],
};

fontfamily로 설정해준 후

//App.tsx
import "./App.css";
import { TodoComponent } from "./components/TodoComponent";
function App() {
  return (
    <div className="font-Dovemayo_wild flex flex-col justify-center items-center">
      <TodoComponent />
    </div>
  );
}

export default App;

app.tsx에 전역폰트로 설정해주었다!

적용이 잘 된 모습 🥰