UI Design Tutorial - Messenger Contact List | HTML CSS BOOTSTRAP

Опубликовано: 06 Июнь 2026
на канале: CODE HASH

606

In this UI Design tutorial you will learn how to design Messenger Contact List App UI using HTML, CSS & Bootstrap.

------------------------------------------------------
Other Tutorials
------------------------------------------------------

Simple Neomorphic Design
   • UI Design Tutorial -  Simple Neomorphic De...

Color Palette
   • UI Design Tutorial - Color Palette | HTML ...

Food Search / Filter
   • UI Design Tutorial - Food Search / Filter ...

Soft Neumorphic Button
   • UI Design Tutorial - Soft Neumorphic Butto...

Health Scanner App
   • UI Design Tutorial - Health Scanner App | ...

Ticket Purchase App
   • UI Design Tutorial - Ticket Purchase App |...

------------------------------------------------------

Fonts used for icons
http://fontawesome.io/

Source Code:
Codepen:
https://codepen.io/code_hash/pen/vYNBQLe

------------------------------------------------------
Images Source:

b1.png
https://pixabay.com/photos/guy-boy-sm...

g2.png
https://pixabay.com/photos/girl-portr...

g3.png
https://pixabay.com/photos/woman-grow...

b2.png
https://pixabay.com/photos/isolated-m...

g4.png
https://pixabay.com/photos/communion-...

b3.png
https://pixabay.com/photos/man-young-...

g6.png
https://pixabay.com/photos/girl-red-h...

------------------------------------------------------

Like us on facebook
  / code1hash

Video Link:    • UI Design Tutorial - Messenger Contact Lis...

------------------------------------------------------