Retro Maps コンポーネント

レトロ/ビンテージデザイン、類似の配色、ダークテーマのサポートを備えた、シンプルでレスポンシブなマップコンポーネントで、Tailwind CSS を使用します。ブログやコンテンツWebサイトに適しています。

プレビュー

HTMLコード

<div class="bg-gray-200 dark:bg-gray-800 p-4 rounded-lg">
  <div class="aspect-w-16 aspect-h-9">
    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3153.7108355932566!2d144.963735!3d-37.814107!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6ad642b8c21cb29b%3A0x5045675218da3d1!2sMelbourne%20VIC%2C%20Australia!5e0!3m2!1sen!2sus!4v1646014098405!5m2!1en!2sus" 
            width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" class="rounded-lg"></iframe>
  </div>
</div>

関連コンポーネント

ミニマリスト単色ビジネスマップコンポーネント

ビジネスや企業の Web サイト向けに設計されたレスポンシブでインタラクティブなマップコンポーネントで、ミニマリストのフラットデザイン、単色の配色、ダークモードのサポートが特徴です。プレースホルダー、マップ画像、および連絡先の詳細プレースホルダーが含まれています。

開ける

Brutalist ダッシュボードマップコンポーネント

鮮やかな色、高コントラスト、複雑なインタラクティブ要素、レスポンシブデザイン、Tailwind CSS を使用したダークテーマのサポートを備えたブルータリズムスタイルのダッシュボードマップコンポーネント。

開ける

Brutalist Maps コンポーネント

Tailwind CSS を使用したモノクロカラーとダークモードをサポートする、ブルータリズムスタイルの複雑な e コマースマップコンポーネント。残忍なデザイン要素で製品の場所を表示します。

開ける