Morphでは、MDXのスタイリングにTailwind CSSを使用することができます。Tailwind CSSは、HTMLのクラス属性を使ってスタイルを適用するCSSフレームワークです。Tailwind CSSを使うことで、CSSを直接記述することなく、簡単にスタイリングを行うことができます。

Tailwind CSS

公式ドキュメント

具体的な使用方法は、サンプルアプリケーションを参照してください。

サンプルアプリ + コード

記述例

MDXファイル内で、HTML要素にTailwind CSSのクラスを適用することができます。以下の例では、<div>要素にbg-blue-500text-whiteのクラスを適用しています。

<div className="bg-blue-500 text-white p-4">
  <h1>スタイリング</h1>
  <p>このページは、Tailwind CSSを使ったスタイリングの記述例です。</p>
</div>