All tags/Avatar

A team list

Every member gets a circle with their initials - the colour comes from a hash of the name, the text colour from its contrast.

1 The data avatar/team.php php

<?php

  $team = [
    [ 'name' => 'Herbert Jebbink',    'role' => 'Founder and engine'     ],
    [ 'name' => 'Ada Lovelace',       'role' => 'Sequences'              ],
    [ 'name' => 'Grace Hopper',       'role' => 'Compilers and tooling'  ],
    [ 'name' => 'Alan Turing',        'role' => 'Expression evaluator'   ],
    [ 'name' => 'Émile Zola',         'role' => 'Translations'           ],
    [ 'name' => 'Margaret Hamilton',  'role' => 'Error handling'         ] ];

?>

2 The template avatar/team.pad pad

<ul style="list-style:none; margin:0; padding:0; display:grid; gap:14px">
  {team}
  <li style="display:flex; align-items:center; gap:12px">
    {avatar $name, size=44}
    <span><strong>{$name}</strong><br><small style="opacity:.7">{$role}</small></span>
  </li>
  {/team}
</ul>

3 The result rendered on the server

Herbert Jebbink
Founder and engine
Ada Lovelace
Sequences
Grace Hopper
Compilers and tooling
Alan Turing
Expression evaluator
Émile Zola
Translations
Margaret Hamilton
Error handling