A forma de um bloco é determinada por um renderizador com base na definição do bloco, ou seja, nos campos e conexões dele.
Renderizadores integrados
O Blockly fornece três renderizadores integrados, cada um com uma sensação diferente para o programa.
| Renderizador | Descrição | Imagem |
|---|---|---|
| Thrasos | O renderizador recomendado. É uma abordagem mais moderna do renderizador de geras, com espaçamento mais uniforme e bordas sólidas. | 
|
| Geras | O renderizador padrão. É o renderizador original usado para criar o Blockly. | 
|
| Zelos | Um renderizador baseado no design de blocos do Scratch-3.0. |  |
Para usar um desses renderizadores, transmita o nome nas opções de configuração:
Blockly.inject('blocklyDiv', {
renderer: 'thrasos'
});
Renderizadores personalizados
Se você quiser dar ao seu programa uma aparência diferente de qualquer um dos renderizadores integrados, também é possível criar um renderizador personalizado. Para começar, a equipe do Blockly recomenda:
- Leia as documentações do conceito do renderizador para saber como todos os componentes de um renderizador se encaixam.
- Conclua o codelab de renderizador personalizado para praticar a renderização personalizada.
- Adicione o renderizador de depuração ao seu projeto.
- Personalize seu renderizador.