CSS3.0 Maker – Obtenha código CSS para efeitos de borda, caixa de sombra e muito mais

Analisamos alguns geradores de código CSS antes, como Layer Styles e ThemeShock CSS Drop Shadow Generator . Ambos são excelentes, mas limitados, pois geram código apenas para um único efeito. CSS3.0 Maker é um gerador de código CSS automático que gera código para borda, sombra de texto, sombra de caixa, efeitos de contorno e inclinação, escala ou rotação de um elemento. Você pode trabalhar em vários arquivos CSS (diferentes estilos em cada arquivo) criando diferentes arquivos. O código é baixado como um arquivo HTML e o CSS é adicionado como uma planilha interna. O serviço informa em qual versão do Chrome, Firefox, Internet Explorer, Safari e Opera os efeitos serão renderizados e quais dispositivos móveis serão compatíveis.

Para criar vários arquivos, você precisará se inscrever para uma conta gratuita. Caso contrário, o serviço pode ser usado sem criar um. Curiosamente, o site permite adicionar mais efeitos quando você não está logado. Os efeitos adicionais que estão disponíveis (quando desconectado) são efeitos de Gradiente, Animação e Transição. Quando usado como usuário não registrado, o site não permite adicionar vários efeitos. Se você optar por usar o serviço sem registrar uma conta, verá uma barra horizontal logo abaixo do cabeçalho do site que permite selecionar diferentes efeitos.

Se você deseja adicionar vários efeitos, inscreva-se em uma conta gratuita e crie um arquivo. Você pode criar um arquivo clicando em Novo arquivo na página inicial ou acessando Meus arquivos . Digite um nome para o seu arquivo. Selecione Editar e todas as alterações feitas serão salvas neste arquivo. Vá para a guia Início para começar a editar os efeitos.

Para se mover entre diferentes efeitos, use o menu suspenso na guia Início . Para alterar a cor do elemento e ajustar sua opacidade, acesse o efeito RGBA. Para adicionar uma borda ou alterar estilos de borda, vá para Border Radius. Os efeitos Text Shadow e Box Shadow criam um efeito de sombreamento atrás do elemento ou do texto. Você pode distorcê-lo e dimensioná-lo a partir do efeito CSS Transform e deslocar a borda do elemento a partir do efeito Outline Offset .

Depois de fazer todas as alterações e aplicar os efeitos necessários, clique em Salvar e depois em Baixar , para baixar o arquivo. Faça as alterações necessárias e você terá seu CSS pronto para uso. O serviço é excelente se você quiser experimentar o design ou se precisar apenas experimentar uma série de efeitos CSS para um projeto específico.

Visite o Criador de CSS3.0

Leave a Comment

Novidades no Android 4.0 Ice Cream Sandwich [Análise de recursos]

Novidades no Android 4.0 Ice Cream Sandwich [Análise de recursos]

O Android 4.0 Ice Cream Sandwich (ICS) foi revelado pelo Google e pela Samsung em um evento em Hong Kong em outubro e, como esperado, este é o mais

Como gerar arquivo OPML a partir de feeds RSS

Como gerar arquivo OPML a partir de feeds RSS

Se você estiver trocando de um leitor de feeds para outro, será um processo frenético acessar cada um dos seus sites de feeds e assinar novamente. Para migrar

Faça downgrade do iPhone 3G e 3GS do iOS 4 para 3.1.2

Faça downgrade do iPhone 3G e 3GS do iOS 4 para 3.1.2

Usuários que desejam fazer o downgrade de seus dispositivos iPhone 3G e iPhone 3GS após atualizar acidentalmente para o iOS 4 acharão este guia útil, graças ao comentarista

Como usar o Snap Camera com o Google Meet

Como usar o Snap Camera com o Google Meet

O Google Meet possui um recurso de desfoque de fundo que desfoca o fundo ou o mascara com uma imagem. Esse é o alcance dos efeitos que ele tem. Como o Google

As 150 melhores extensões de navegador e aplicativos da web de 2011 [escolha do editor]

As 150 melhores extensões de navegador e aplicativos da web de 2011 [escolha do editor]

Quer você use um Mac ou um PC com Windows, você ainda está usando a mesma internet. Seus problemas, irritações e frustrações online são semelhantes, e você está

Como dividir a tela do Firefox para abrir espaço para mais conteúdo

Como dividir a tela do Firefox para abrir espaço para mais conteúdo

Se você usa o Firefox e quer aumentar sua produtividade, esta dica é para você. O Split Browser é um complemento gratuito para o Firefox que divide seu navegador em vários navegadores.

DropItToMe é uma maneira segura de permitir que as pessoas enviem arquivos para o seu Dropbox

DropItToMe é uma maneira segura de permitir que as pessoas enviem arquivos para o seu Dropbox

Quando postamos sobre o Dropbox Uploader em agosto, muitas pessoas se inspiraram e criaram sua própria versão do script modificando o original

Plugin de gravador de macro para Google Chrome

Plugin de gravador de macro para Google Chrome

Macros são simplesmente incríveis. Explicamos como você pode usar Macros no Excel 2010, Word 2010, etc. para gravar e reproduzir tarefas repetitivas. Agora, os responsáveis ​​por

Acesse todas as suas contas de e-mail pelo Gmail

Acesse todas as suas contas de e-mail pelo Gmail

Quer gerenciar todas as suas contas de e-mail, como Hotmail, Yahoo, AOL, etc., pelo Gmail? Em vez de verificar diferentes contas de e-mail em seus sites,

Como aplicar zoom no Microsoft Teams

Como aplicar zoom no Microsoft Teams

O Microsoft Teams tem uma interface razoavelmente boa. Os ícones são bem feitos e o modo escuro ainda permite que os usuários leiam facilmente o texto no fundo escuro.