Skip to content

A sleek and responsive clone of the modern Twitter/X homepage, built entirely with HTML5 and Tailwind CSS. This project features a dark-mode layout, tweet composer, trending section, suggested follows, media support, and a pixel-perfect recreation of both old and new Twitter UIs. Ideal for UI/UX practice and frontend portfolio enhancement.

Notifications You must be signed in to change notification settings

Arsh-pixel-cmd/X-clone-TailwindCss-

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

8 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🐦 Twitter/X UI Clone

A modern UI clone of Twitter/X built using HTML and Tailwind CSS.

πŸ“Έ Preview

Old Twitter UI New X UI
![Old UI]twitter-old-homepage.png ![X UI]x-home-Page.png

πŸš€ Features

  • πŸ”₯ Dark mode layout inspired by the current X (Twitter) design
  • πŸ“ Post input section with icons
  • πŸ“Š Trending topics section
  • 🀝 Who to follow panel
  • πŸ‘€ Profile picture and interaction options on each post
  • πŸŽ₯ Support for embedded videos and images
  • πŸ’‘ Built completely with HTML + Tailwind CSS

πŸ› οΈ Tech Stack

  • HTML5
  • Tailwind CSS v4
  • Google Material Symbols

πŸ“‚ Folder Structure

/project-root β”‚ β”œβ”€β”€ index.html # Main HTML file β”œβ”€β”€ output.css # Tailwind compiled CSS β”œβ”€β”€ profilePic.jpg # Profile image β”œβ”€β”€ twitter old homepage.png # Old Twitter UI screenshot └── x homePage.png # New Twitter/X UI screenshot

About

A sleek and responsive clone of the modern Twitter/X homepage, built entirely with HTML5 and Tailwind CSS. This project features a dark-mode layout, tweet composer, trending section, suggested follows, media support, and a pixel-perfect recreation of both old and new Twitter UIs. Ideal for UI/UX practice and frontend portfolio enhancement.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published