Os cartões de uma grade podem ser dispostos pela página. CardTemplate (cardRenderer no React ) substitui o que está dentro de cada cartão, e a grade ainda desenha o cartão ao redor dele — sua borda, sua caixa de seleção e seu estado selecionado. O cartão que ele entrega ao modelo renderiza qualquer uma das colunas da grade como sua célula faria, com sua formatação, seu link e o destaque da busca, então um template decide apenas para onde cada coluna vai. Ele também fornece o avatar do card, o cabeçalho de cada coluna, o próprio registro e maneiras de abrir o registro e selecionar seu cartão.
A foto e o nome de cada contato ficam no topo com a empresa abaixo, e um crachá ao lado mostra a idade do contato em uma cor escolhida pela idade. O e-mail, telefone e data de nascimento seguem, cada um atrás de um ícone, com o nome da coluna como dica de ferramenta, e um contato sem valor para um omite. Clique em qualquer outro lugar de um cartão para selecioná-lo, ou clique duas vezes para abrir o contato; Abrir e Selecionar fazem o mesmo a partir dos botões próprios do cartão, que mantêm os cliques deles. Pesquise na grade e as correspondências são marcadas dentro dos cartões, como estão na tabela; mude para as linhas da tabela na barra de ferramentas para ver os mesmos contatos ali.