Com os filtros do SVG, é possível adicionar efeitos especiais aos gráficos SVG e ao texto. Use os efeitos de CSS para outros tipos de elementos.
Para adicionar ou editar um filtro do SVG, faça o seguinte:
- Clique com o botão direito do mouse no elemento SVG ou de texto.
- Selecione Adicionar filtro do SVG... no menu pop-up. Se um filtro já tiver sido aplicado, selecione Editar filtro do SVG....
- Na caixa de diálogo Editar filtro do SVG, selecione um filtro na lista suspensa Filtro no painel à direita.
- Personalize as configurações do filtro.
- Clique em Salvar. Suas configurações serão lembradas como um filtro personalizado.
Observação: não é possível aplicar filtros SVG quando uma regra de mídia está ativa.
Elementos de texto
Quando você aplica um filtro do SVG a um elemento de texto, ele é convertido em SVG, e não é mais possível editá-lo com a ferramenta "Texto". O texto do SVG é exibido em uma única linha sem quebra, então qualquer quebra de linha é removida. A conversão pode ser desfeita removendo o filtro do SVG.
Na caixa de diálogo Editar filtro do SVG, é possível fazer as seguintes mudanças no texto:
- Texto (conteúdo do texto)
- Tamanho da fonte
- Cor do texto
Filtros e as configurações deles
Nenhum
Aura
Circunda o elemento SVG com uma aura.
Configuração | Descrição |
---|---|
Raio X | É o raio horizontal da aura. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Raio Y | É o raio vertical da aura. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Cor | É a cor da aura. |
Bisel
Dá um aspecto biselado às bordas do elemento SVG.
Configuração | Descrição |
---|---|
Arredondamento | É a curvatura do bisel. |
Profundidade | É a profundidade do bisel. |
Desfoque
Desfoca o elemento SVG.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta o nível de desfoque do elemento. |
Raio X | É o raio horizontal do desfoque. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Raio Y | É o raio vertical do desfoque. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Com crateras
Dá um aspecto de crateras ao elemento SVG.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta o tamanho das crateras. |
Profundidade | É a profundidade das crateras. |
Ângulo | É o ângulo das crateras. |
Dissolver
Desgasta partes do elemento SVG.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta o tamanho das áreas dissolvidas. |
Definição | É o nível de preservação das bordas originais. |
Sombra projetada
Adiciona uma sombra projetada ao elemento SVG.
Configuração | Descrição |
---|---|
X da sombra | É o deslocamento horizontal da sombra do elemento. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Y da sombra | É o deslocamento vertical da sombra do elemento. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Raio de desfoque | É o raio do desfoque da sombra. Valores maiores fazem com que a sombra pareça mais desfocada. |
Cor | É a cor da sombra. |
Cintilação
Cria a aparência de uma luz iluminando o elemento SVG.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta a parcela do elemento SVG que é iluminada. |
Altura da luz | Indica a altura da luz. Isso afeta o ângulo em que a luz atinge o elemento SVG. |
Cor | É a cor da luz. |
Luminosidade
Adiciona um brilho ao elemento SVG.
Configuração | Descrição |
---|---|
Raio X | É o raio horizontal da luminosidade. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Raio Y | É o raio vertical da luminosidade. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Cor | É a cor da luminosidade. |
Inflar
Faz com que o elemento SVG pareça inflado como um balão.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta a aparência de tridimensionalidade do elemento. |
Cor da tonalidade | É a cor da tonalidade reflexiva do elemento. |
Intensidade da tonalidade | É a intensidade da tonalidade reflexiva. |
X da sombra | É o deslocamento horizontal da sombra do elemento. |
Y da sombra | É o deslocamento vertical da sombra do elemento. |
Contorno
Adiciona um contorno às bordas do elemento SVG.
Configuração | Descrição |
---|---|
Raio X | É o raio horizontal do contorno. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Raio Y | É o raio vertical do contorno. Manter idêntico : quando esse botão está ativo, os valores de raio X e Y permanecem iguais. |
Cor | É a cor do contorno. |
Sépia
Muda as cores do elemento SVG para tons sépia.
Configuração | Descrição |
---|---|
Brilho | É o brilho do elemento. |
Respingo
Faz com que o elemento SVG pareça estar respingando líquido. São gerados dois efeitos de líquido respingando. No exemplo abaixo, "Respingo 1" é roxo, enquanto "Respingo 2" é azul.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito geral. Isso afeta o tamanho das gotículas de líquido. |
Padrão | Selecione um dos 10 padrões de respingos. |
Brilho | É o brilho do elemento. |
Dissolução | É o nível de dissolução aparente do elemento. |
Escala do respingo 1 | É a escala do primeiro efeito de respingo. |
Desfoque do respingo 1 | É o desfoque do primeiro efeito de respingo. |
Cor do respingo 2 | É a cor do segundo efeito de respingo. |
Escala do respingo 2 | É a escala do segundo efeito de respingo. |
Desfoque do respingo 2 | É o desfoque do segundo efeito de respingo. |
Texturizado
Confere ao elemento SVG uma aparência texturizada.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta o tamanho dos segmentos de textura. |
Cor da tonalidade | É a cor da tonalidade. |
Intensidade da tonalidade | É a intensidade da tonalidade. |
Desfoque | É o desfoque do elemento. |
Arredondamento | É a curvatura de cada segmento de textura. |
Padrão | Selecione um dos 10 padrões de textura. |
Distorção
Distorce o elemento SVG.
Configuração | Descrição |
---|---|
Escala | É a escala do efeito. Isso afeta o tamanho das ondulações de distorção. |
Distorção | É a gravidade da distorção. |