User Profile Icon From Name Using CSS Like Gmail

Generate user profile icon on any listing page by first name and last name with the help of css, with different background colors.

Here I want to explain how you can show user icon with background color and user name text or your listing page.

csstexticon

Here is the show simple steps, just follow below steps and see the results :

  1. PHP Code
    Define data array and function for generate user icon from name and set different background colors

     
  2. HTML Code
    Bewlow show simple HTML code, you can modify below code as you want.

     
  3. CSS Style
    Here show css for listing table stylesheet and user icon stylesheet, you can change it if you want.