Composant Visionneuse de fichiers
Un composant de visionneuse de fichiers réactif conçu pour les sites Web de commerce électronique en mode sombre avec une palette de couleurs monochromatiques. Il comprend des fonctionnalités interactives telles que le téléchargement et l’aperçu des fichiers.
HTML Code
<div class="bg-gray-800 text-gray-200 p-6 rounded-lg shadow-lg max-w-lg mx-auto">
<h2 class="text-2xl font-semibold mb-4">File Viewer</h2>
<div class="mb-4">
<label class="block mb-2">Upload File:</label>
<input type="file" class="bg-gray-900 text-gray-200 p-2 border border-gray-600 rounded w-full" />
</div>
<div class="mt-4">
<h3 class="text-xl mb-2">File Preview:</h3>
<div class="bg-gray-700 p-4 rounded">
<img src="https://picsum.photos/300/200" alt="Preview" class="w-full rounded" />
</div>
<div class="flex items-center mt-2">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-10 h-10 rounded-full mr-2" />
<div>
<span class="font-bold">Uploaded by:</span> John Doe
</div>
</div>
</div>
<div class="mt-4">
<button class="bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded">
Confirm Upload
</button>
</div>
</div>Composants associés
Composant Visionneuse de fichiers
Un composant de visionneuse de fichiers simple et réactif avec un design inspiré du papier/de l’impression adapté aux sites Web d’entreprise. Dispose de couleurs analogues, d’un HTML sémantique et d’une prise en charge du mode sombre.
Composant Visionneuse de fichiers
Composant de visionneuse de fichiers réactif avec brutalisme et design pastel
Visionneuse de fichiers Composant 1
Un composant de visualisation de fichiers minimaliste conçu à l’aide de Tailwind CSS, avec des effets réactifs et la prise en charge des thèmes sombres. Affichez des fichiers avec une mise en page épurée, y compris des espaces réservés pour les images et les avatars des utilisateurs.