A forma de um bloco é determinada por um renderizador com base na definição do bloco (ou seja, seus campos e conexões).
Renderizadores integrados
O Blockly fornece três renderizadores integrados, cada um com uma aparência ligeiramente diferente para o programa.
| Renderizador | Descrição | Imagem |
|---|---|---|
| Thrasos | O renderizador recomendado. É uma versão mais moderna do renderizador geras, com espaçamento mais uniforme e bordas sólidas. | 
|
| Geras | O renderizador padrão. É o renderizador original com o qual o Blockly foi criado. | 
|
| Zelos | Um renderizador com base no design de blocos do Scratch-3.0. |  |
Para usar um desses renderizadores, transmita o nome para as opções de injeção:
Blockly.inject('blocklyDiv', {
renderer: 'thrasos'
});
Renderizadores personalizados
Caso queira que o programa tenha uma aparência diferente de qualquer um dos renderizadores integrados, crie um renderizador personalizado. Para começar, a equipe do Blockly recomenda que você:
- Leia os documentos do conceito do renderizador para saber como todos os componentes de um renderizador se encaixam.
- Conclua o codelab sobre renderizador personalizado para ter uma experiência prática com a renderização personalizada.
- Adicione o renderizador de depuração ao projeto.
- Personalize seu renderizador.