css (config)

Registers global CSS files to include in every page of the app.

Since Nuxt 3.0 Spec ↗

Syntax

css: string[]

Parameters

NameTypeRequiredDescription
css string[] No Paths to global stylesheets (`.css`, `.scss`, `.sass`, etc.) or packages. Resolved relative to the project or node_modules.

Returns

NuxtConfig — Injected globally during build.

Examples

export default defineNuxtConfig({
  css: [
    '~/assets/css/main.css',
    'animate.css/animate.min.css',
  ],
})
export default defineNuxtConfig({
  css: ['~/assets/scss/global.scss'],
  vite: {
    css: {
      preprocessorOptions: {
        scss: { additionalData: '@use "~/assets/scss/vars.scss";' },
      },
    },
  },
})

Notes

Files listed here are bundled and applied globally. Install the matching preprocessor (e.g. `sass`) for `.scss`/`.sass`. For component-scoped styles use `<style scoped>` instead. Order in the array is preserved.

See also