htmlcss2

Related Examples

• 
  Expandable File Tree with Tailwind and Vanilla JS with tailwinds 4

  A simple and responsive file tree component built with Tailwind CSS and vanilla JavaScript. Each folder can be expanded or collapsed with smooth transitions, including the root directory. This component is useful for project explorers, code editors, or file management UIs.

  Author:
  Indra

  1 month ago

  74
• 
  Table

  Table with image and status with pagination buttons

  Author:
  Abhiraj

  9 months ago

  2.1k
• 
  Sticky fullpage pages / slides

  Author:
  Hasan AlDoy (McDoy)

  8 months ago

  1.2k
• 
  My Coding Journey

  To transform a standard timeline into an engaging, scroll-driven narrative experience.

  Author:
  Code Master(Mfuranziza Dusabe Hamza)

  3 weeks ago

  152
• 
  Forgot password?

  you can change password an time

  Author:
  gidy

  4 months ago

  410
• 
  Portfolio

  This responsive portfolio with dark mode support includes: 1. Fully responsive design that works on both desktop and mobile devices 2. Dark mode toggle with system preference detection and local storage persistence 3. Indigo-800 and Blue-900 color scheme for primary colors in light and dark modes 4. Beautiful animations and effects: 1. Fade-in and slide-up animations for sections using Intersection Observer 2. Hover effects on projects and buttons 3. Smooth scrolling for navigation 5. Mobile-friendly navigation with a toggle menu 6. Sections for About, Projects, and Contact 7. A contact form with styled inputs 8. Social media links in the footer 9. Accessibility considerations (proper heading structure, color contrast, focus styles, ARIA labels) Key features: - The color scheme uses Indigo-800 for light mode and orange-400 for dark mode as primary colors - Dark mode toggle in the header with a sun/moon icon - Sections fade in and slide up as they enter the viewport - Project cards have a hover effect with scaling and increased shadow - The contact form has animated focus states - Social media icons change color on hover - The layout is responsive, with a hamburger menu for mobile screens - Smooth scrolling behavior for navigation links - Dark mode preference is saved in local storage and syncs with system preference This implementation provides a visually appealing, accessible, and functional responsive portfolio with dark mode support, using HTML, Tailwind CSS, and vanilla JavaScript for the

  Author:
  nejaa badr

  11 months ago

  2.8k
• 
  free tailwind resume template

  free tailwind resume template

  Author:
  Geoffrey Callaghan

  1 year ago

  3.4k
• 
  Plant Game

  Checking to see if it works

  Author:
  Becky Keyworth

  5 months ago

  541
• 
  Modern Responsive Footer with Tailwind CSS

  This sleek and modern responsive footer is built using HTML and Tailwind CSS. It features three sections: brand information, useful links, and social media icons. The footer includes smooth hover effects, subtle fade-in animations, and a fully responsive design that adapts seamlessly to different screen sizes. Perfect for websites looking for a professional and stylish footer section.

  Author:
  Ayyamperumal S

  8 months ago

  1.4k
• 
  Tailwind css banner offer

  Bold neobrutalist design with thick borders, vibrant colors, and strong shadows - perfect for promotions.

  Author:
  saim-t8

  1 month ago

  301
• 
  Radial Progress Indicator with TailwindCSS

  A sleek and customizable radial progress indicator built with SVG and styled using TailwindCSS. The progress bar is animated with smooth transitions, featuring a circular background, dynamic progress, and centered text or optional imagery. Perfect for showcasing percentages, stats, or any progress-related metrics in your projects.

  Author:
  SHARIFUL ISLAM

  8 months ago

  1.6k
• 
  Forgot Password Form

  1. Color Updates: 1. Changed background to gradient `from-indigo-800 to-blue-900` 2. Updated text colors to match the new theme 3. Changed button colors to `bg-indigo-800` with `hover:bg-blue-900` 4. Updated focus rings to use indigo colors 5. Made footer links white with indigo hover states 2. Enhanced Styling: 1. Added gradient background 2. Improved border radius to `rounded-xl` 3. Enhanced shadow with `shadow-2xl` 4. Added hover scale effects 5. Added fade-in animation 3. Dark Mode Improvements: 1. Enhanced dark mode colors 2. Added system preference detection 3. Improved dark mode contrast 4. Updated dark mode focus rings 4. Added Functionality: 1. Added form validation 2. Added success message 3. Added form reset after submission 4. Added smooth transitions 5. Accessibility Improvements: 1. Maintained ARIA attributes 2. Enhanced focus states 3. Improved color contrast 4. Added transition animations for better UX 6. Added Interactions: 1. Hover effects on all interactive elements 2. Scale animation on card and button hover 3. Smooth color transitions 4. Form validation feedback The form now matches the Indigo-800 and Blue-900 color scheme while maintaining dark mode support and adding enhanced animations and interactions.

  Author:
  nejaa badr

  11 months ago

  1.1k