Exemplos de Botões de Compartilhamento Social

O modelo mostra quatro botões retangulares para compartilhar conteúdo nas redes sociais mais populares. Mantiveram as cores originais e exibem os nomes e símbolos das redes. Este é um bom exemplo de personalização para cenários em que você quer que seus botões fiquem em uma zona de conteúdo, por exemplo, em um artigo.

É assim que você cria botões práticos para todos os usuários — o layout flutuante acompanha a rolagem da página e fica sempre à mão. Os usuários nunca vão perder de vista os botões. O design é minimalista, com formato quadrado e apenas os ícones das redes sociais nos botões.

Usando as opções de personalização, você pode obter uma aparência totalmente única do widget. Esses botões foram criados para refletir o estilo e as cores gerais do site. São pretos e brancos, geométricos e minimalistas, graças ao fato de apresentarem apenas os ícones das redes sociais — sem os nomes.

Estes botões compactos e elegantes ficam com um visual limpo na página. São circulares, em estilo material, exibem os ícones da mídia escolhida. Um suave efeito de transição ao passar o mouse traz dinamismo à experiência do usuário. Os botões ficam centralizados, mas você também pode escolher variantes alinhadas à esquerda e à direita.

Estes botões têm formato circular, mas graças à largura responsiva, o tamanho foi ajustado para ficarem ovais e mais robustos. O usuário escolheu a variante Flat do Style e manteve as cores originais das mídias, mas adicionou a cor preta e a animação de bounce ao passar o mouse.

Ícones em formato retangular são organizados de forma agradável em uma grade e exibem tanto os ícones quanto o texto com os nomes das mídias. Eles cabem em uma zona de conteúdo, a unidade final de um artigo ou o rodapé da página. Uma animação de slider atraente fica ativa nos símbolos, e os ícones ficam pretos ao passar o mouse.

O autor editou os rótulos dos botões e adicionou uma chamada para ação em cada um. Não há ícones de mídia — em vez disso, os nomes foram adicionados. O fundo dos botões foi alterado para branco, e a cor do texto é a original de cada mídia para estabelecer a associação visual.

Para facilitar o compartilhamento do conteúdo pelos usuários, neste exemplo há botões para os mensageiros mais populares. Os botões mantêm as cores originais e exibem o nome junto com o ícone. São de formato arredondado e, graças à largura automática, ocupam exatamente o espaço certo na página.