APIリファレンス・Tailwindブリッジ

@oriatheme/tailwind

oria-standard@2 ランタイム変数を Tailwind CSS v4 @theme インライン名前空間に静的にマップします。

パッケージと環境

純粋な静的 CSS とジェネレーター。 Tailwind CSS 4.3.3 は、コンシューマーランタイムの依存関係としてではなく、独自のビルドとテストにのみ使用されます。

bash

pnpm add @oriatheme/tailwind

bash

npm install @oriatheme/tailwind

bash

yarn add @oriatheme/tailwind

bash

bun add @oriatheme/tailwind

コンシューマプロジェクトによってすでに選択されているパッケージマネージャーとロックファイルを使用します。例では、パッケージルートエクスポートのみを使用します。 src、dist、またはレジストリテンプレートからディープインポートしないでください。

CSS bridge

@oriatheme/tailwind/oria.css is the static @theme inline bridge for the default oria prefix: 43 colors, font families with nine weights, a 13-step text scale (text.md maps to --text-base with paired line heights), leading/tracking, --spacing, derived radius, shadow, blur, and --ease-oria-*, plus explicit backdrop-oria-*, duration-oria-*, inset-shadow-oria, shadow-highlight, bg-oria-canvas, and bg-oria-surface utilities.

css

@import "tailwindcss";
@import "@oriatheme/colors/styles.css";
@import "@oriatheme/colors/tailwind.css";
@import "@oriatheme/tailwind/oria.css";

ジェネレーターとカスタムプレフィックス

エクスポート	署名	説明
`generateOriaTailwindBridge`	`(options?: { prefix?: string }) => string`	検証されたカスタムプレフィックスの静的ブリッジを生成します。
`oriaTailwindBridgeDefaultPrefix`	`"oria"`	パッケージ化された oria.css で使用されるプレフィックス。

カスタムプレフィックスは静的ブリッジに事前に構築する必要があります。 CSS 変数名は実行時に連結されません。

bash

oria theme tailwind-bridge --prefix acme --out src/oria-tailwind.css