360°ビューアコンポーネント
ブルータリズムスタイルでデザインされた360°ビューアコンポーネントで、ハイコントラストと珍しいレイアウトが特徴で、ダークテーマとレスポンシブデザインエフェクトをサポートしています。
HTMLコード
<div class="bg-gray-900 text-white p-8 rounded-lg shadow-lg flex flex-col items-center">
<h2 class="text-3xl font-bold mb-6">360° Viewer</h2>
<p class="text-lg mb-4">Explore the 360° view of the object.</p>
<div class="w-full h-64 border-4 border-white overflow-hidden rounded-lg flex items-center justify-center">
<img src="https://picsum.photos/600/400?random=1" alt="360 View" class="transform duration-500 hover:scale-105"/>
</div>
<div class="mt-6 flex space-x-4">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-12 h-12 rounded-full border-4 border-white shadow-lg"/>
<img src="https://randomuser.me/api/portraits/women/1.jpg" alt="Avatar" class="w-12 h-12 rounded-full border-4 border-white shadow-lg"/>
</div>
</div>関連コンポーネント
PastelBrutalist360アセットビューア
ブルータリズムのデザインスタイルとパステルピンクの配色を備えた、シンプルでレスポンシブな360°アセットビューアコンポーネント。ダッシュボード用に調整されており、静止画像プレースホルダー(360°ビューをシミュレート)、機能しないコントロールボタン、および情報表示を備えています。Tailwind CSSで構築され、ダークモードをサポートし、太い境界線とハードオフセットシャドウで生々しく大胆な美学を示しています。
360°ビューアコンポーネント
ソーシャルメディア用のマイクロインタラクションを備えたレスポンシブ360°ビューアコンポーネントで、類似の色と適度な複雑さを使用した明るいテーマと暗いテーマが特徴です。