ライブプレビューで美しいCSSパンくずリストを作成します。複数のスタイル、区切り文字、カスタマイズ可能な色を備えたパンくずリストを生成 — すべてコピペ可能なCSSコードで。
CSS パンくずリストジェネレーターは、純粋なCSSを使用して美しいパンくずリストナビゲーションコンポーネントを作成する無料のオンラインツールです。デフォルト、矢印、ピル、下線、ミニマルなどの複数のスタイルから選択できます。区切り文字の種類、色、角丸、ホバーエフェクトをカスタマイズできます。各パンくずリストは、すべてのモダンブラウザで動作するクリーンでコピペ可能なCSSコードで生成されます。JavaScriptライブラリは不要です。
すべてのパンくずリストは、モダンブラウザ（Chrome、Firefox、Safari、Edge）でサポートされている標準的なCSS3プロパティを使用しています。レイアウトにはFlexboxを使用しており、すべての最新ブラウザで十分にサポートされています。
はい！ジェネレーターは、選択した数の項目を含むテンプレートを作成します。HTMLにさらに`<li>`要素を追加するだけで、追加のパンくずレベルを含めることができます。
生成されたHTMLは、適切なARIAラベルを持つセマンティックな`<nav>`および`<ol>`要素を使用しており、スクリーンリーダーと支援技術でパンくずリストにアクセスできるようになっています。
ジェネレーターはテキストベースの区切り文字を提供します。アイコンフォントやSVG区切り文字を使用するには、`::before`疑似要素の`content`プロパティをアイコンフォント文字に置き換えるか、背景画像を使用してください。