Programming

[TIL] pretendard next.js에 적용

jay-dev 2023. 11. 3. 17:24

 

 

tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
    content: ['./src/**/*.{js,ts,jsx,tsx,mdx}'],
    theme: {
        extend: {},
    },
    plugins: [],
};

 

 

globals.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    @font-face {
        font-family: 'Pretendard';
        src: url('/fonts/pretendard-regular.subset.woff2') format('woff2');
        font-display: swap;
    }

    html {
        font-family: 'Pretendard', ui-sans-serif, system-ui, -apple-system,
            BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
            'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
            'Segoe UI Symbol', 'Noto Color Emoji';
    }
}