Glassmorphism コンテンツリンクにスキップ
Glassmorphism は、ダッシュボードのアーストーンを備えたコンテンツリンクコンポーネントにスキップします。
HTMLコード
<a href="#main-content" class="skip-to-content-link sr-only focus:not-sr-only focus:fixed focus:top-4 focus:left-4 focus:p-3 focus:rounded-lg focus:bg-white focus:bg-opacity-30 focus:backdrop-filter focus:backdrop-blur-lg focus:shadow-lg focus:text-stone-800 dark:focus:bg-stone-800 dark:focus:bg-opacity-30 dark:focus:text-stone-200">Skip to main content</a>関連コンポーネント
コンテンツリンクにスキップする
アクセシビリティのための「コンテンツにスキップ」リンクコンポーネントで、グレースケールの配色を持つダークモードダッシュボード用に設計されています。レスポンシブモードとダークモードのスタイリングにより、適度に複雑です。JavaScriptは使用しておりません。ダークテーマのサポートには、Tailwind CSS に dark: プレフィックスを使用します。
SkipToContentLink (コンテンツにスキップするリンク)
ダークモードUI、トライアドカラースキーム、およびEコマース向けのシンプルな複雑さを備えたコンテンツリンクコンポーネントにスキップします。
コンテンツリンクコンポーネントにスキップ - Skeuomorphism グレースケール
ブログコンテンツ用のグレースケールのSkeuomorphicデザインを使用したシンプルでレスポンシブな「コンテンツにスキップ」リンク。ダークモードのサポートが含まれています。