--- title: 概要 description: "Yamada UIのコンフィグは、システムのさまざまな部分で使用されるグローバルな設定です。" --- テーマに定義されているコンフィグは[こちら](https://github.com/yamada-ui/yamada-ui/blob/main/packages/react/src/theme/config.ts)です。 ```tsx import { defineConfig } from "@yamada-ui/react" export const config = defineConfig({ css: { varPrefix: "ui" }, breakpoint: { direction: "down", identifier: "@media screen" }, defaultColorMode: "light", defaultThemeScheme: "base", notice: { duration: 5000 }, theme: { responsive: true }, }) ``` ## プロパティ | プロパティ | デフォルト | 説明 | | --------------------------------------- | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `css.layers` | - | [カスケードレイヤー](https://yamada-ui.com/docs/theming/cascade-layers.md)の設定。 | | `css.varPrefix` | `"ui"` | CSS変数のプレフィックス。 | | `breakpoint.base` | `"9999px"` | ブレイクポイントの基準値。 | | `breakpoint.containerRef` | - | [コンテナクエリ](https://yamada-ui.com/docs/theming/breakpoints.md#コンテナクエリ)を使用する場合のコンテナ要素の参照先。 | | `breakpoint.direction` | `"down"` | [レスポンシブデザイン](https://yamada-ui.com/docs/styling/responsive-design.md)で採用される[メディアクエリ](https://yamada-ui.com/docs/theming/breakpoints.md#メディアクエリ)。 | | `breakpoint.identifier` | `"@media screen"` | ブレイクポイントで採用するクエリ。 | | `defaultColorMode` | `"light"` | デフォルトの[カラーモード](https://yamada-ui.com/docs/theming/color-mode.md)。 | | `defaultThemeScheme` | `"base"` | デフォルトの[テーマスキーム](https://yamada-ui.com/docs/theming/switching-themes.md)。 | | `theme.responsive` | `false` | テーマのトークンで[レスポンシブデザイン](https://yamada-ui.com/docs/styling/responsive-design.md)を採用します。 | | `disableTransitionOnChange` | `false` | カラーモードまたはテーマの切り替え時に`transition`を無効にします。 | | `loading.screen.blockScrollOnMount` | `true` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)中にスクロールをロックします。 | | `loading.screen.allowPinchZoom` | `false` | スクロールがロックされている場合、iOSでズームまたはピンチジェスチャを処理します。 | | `loading.screen.loadingScheme` | `"oval"` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)のスキーム。 | | `loading.screen.duration` | `null` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)の所要時間。 | | `loading.screen.loadingCount` | `0` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)の初期値。 | | `loading.page.blockScrollOnMount` | `true` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)中にスクロールをロックします。 | | `loading.page.allowPinchZoom` | `false` | スクロールがロックされている場合、iOSでズームまたはピンチジェスチャを処理します。 | | `loading.page.loadingScheme` | `"oval"` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)のスキーム。 | | `loading.page.duration` | `null` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)の所要時間。 | | `loading.page.loadingCount` | `0` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)の初期値。 | | `loading.background.blockScrollOnMount` | `false` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)中にスクロールをロックします。 | | `loading.background.allowPinchZoom` | `false` | スクロールがロックされている場合、iOSでズームまたはピンチジェスチャを処理します。 | | `loading.background.loadingScheme` | `"oval"` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)のスキーム。 | | `loading.background.duration` | `null` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)の所要時間。 | | `loading.background.loadingCount` | `0` | [ローディング](https://yamada-ui.com/docs/hooks/use-loading.md)の初期値。 | | `notice.closable` | `true` | [通知](https://yamada-ui.com/docs/hooks/use-notice.md)を閉じることができるようにします。 | | `notice.closeStrategy` | `["click", "drag"]` | [通知](https://yamada-ui.com/docs/hooks/use-notice.md)の閉じる方法。 | | `notice.duration` | `5000` | [通知](https://yamada-ui.com/docs/hooks/use-notice.md)の所要時間。 | | `notice.expand` | `false` | [通知](https://yamada-ui.com/docs/hooks/use-notice.md)を展開して表示します。 | | `notice.limit` | `3` | [通知](https://yamada-ui.com/docs/hooks/use-notice.md)の最大表示数。 | | `notice.placement` | `"start"` | [通知](https://yamada-ui.com/docs/hooks/use-notice.md)の位置。 | | `snacks.closable` | `true` | [スナック](https://yamada-ui.com/docs/hooks/use-snacks.md)に閉じるボタンを表示します。 | | `snacks.duration` | `5000` | [スナック](https://yamada-ui.com/docs/hooks/use-snacks.md)の所要時間。 | | `snacks.limit` | - | [スナック](https://yamada-ui.com/docs/hooks/use-snacks.md)の最大表示数。 | | `snacks.placement` | `"start"` | [スナック](https://yamada-ui.com/docs/hooks/use-snacks.md)の位置。 | | `snacks.startIndex` | `0` | [スナック](https://yamada-ui.com/docs/hooks/use-snacks.md)が開始する`z-index`。 |