Шрифтове ›

Ефекти онлайн, филтри за текст

На тази страница можете да видите наличните филтри за текст. За да видите извикващия код като ефекта, кликнете на него.

В общи линии ще трябва да направите следното:

Свържете стиловия лист;
Активирайте избрания шрифт за единиците текст;
Приложете ефекта, като конфигурирате избрания блок с текст със съответния клас CSS.

Ние непрекъснато добавяме нови филтри в нашата библиотека – проверявайте често!

Anaglyphic

font-effect-anaglyphic ≡

Anaglyphic

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=anaglyphic" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-anaglyphic {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-anaglyphic">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Anaglyphic 2

font-effect-anaglyphic-2 ≡

Anaglyphic 2

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=anaglyphic-2" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-anaglyphic-2 {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-anaglyphic-2">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Blood

font-effect-blood ≡

Blood

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=blood" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-blood {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-blood">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Boardgame

font-effect-boardgame ≡

Boardgame

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=boardgame" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-boardgame {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-boardgame">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Emboss

font-effect-emboss ≡

Emboss

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=emboss" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-emboss {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-emboss">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Fire

font-effect-fire ≡

Fire

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=fire" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-fire {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-fire">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Inset

font-effect-inset ≡

Inset

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=inset" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-inset {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-inset">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Neon

font-effect-neon ≡

Neon

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=neon" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-neon {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-neon">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Outline

font-effect-outline ≡

Outline

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=outline" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-outline {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-outline">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Three Dimensional

font-effect-three-dimensional ≡

Three Dimensional

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=three-dimensional" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-three-dimensional {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-three-dimensional">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Three Dimensional Float

font-effect-three-dimensional-float ≡

Three Dimensional Float

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=three-dimensional-float" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-three-dimensional-float {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-three-dimensional-float">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>

Vintage Retro

font-effect-vintage-retro ≡

Vintage Retro

Код за инсталиране на сайта:

<html>
  <head>
    <link href="https://bg.getfonts.net/allfont.css?fonts=goedemorgen-lucas&effects=vintage-retro" rel="stylesheet" type="text/css" />
    <style>
      .font-effect-vintage-retro {
        font-family: 'Goedemorgen, Luc[as]', Arial;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div class="font-effect-vintage-retro">Making the Web Beautiful with Goedemorgen, Luc[as]!</div>
  </body>
</html>