Rainbow Mirage by @phantomium - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

<title>Definisce il titolo della pagina web.
<cite>Inserisce citazioni e menzioni riguardo un'opera creativa.
selectedPre-seleziona un elemento di input
<ol>Crea liste ordinate o numerate.
<base>Specifica l'URL di base per tutti gli URL relativi all'interno della pagina.
animationDefinisce i parametri dell'animazione di un elemento o selettore

Users

Log in to search for users

Explore

Find inspiration

La cicala e la formica

Curriculum html

vendita ebay(2)

pagina di prova

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 24.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 508.8 127.2" style="enable-background:new 0 0 508.8 127.2;" xml:space="preserve">
  <style type="text/css">
    .st0{
      fill:none;
    }
    .st1{
      font-family:'Verdana';
    }
    .st2{
      font-size:51.4376px;
    }
    .st3{
      opacity:0.5;
      fill:#009FE3;
      enable-background:new    ;
    }
    .st4{
      opacity:0.5;
      fill:#E30613;
      enable-background:new    ;
    }
    .st5{
      opacity:0.5;
      fill:#FFED00;
      enable-background:new    ;
    }
    .st6{
      opacity:0.5;
      fill:#008D36;
      enable-background:new    ;
    }
    .st7{
      opacity:0.5;
      fill:#82368C;
      enable-background:new    ;
    }
    .st8{
      opacity:0.5;
      fill:#00A19A;
      enable-background:new    ;
    }
    .st9{
      opacity:0.5;
      fill:#95C11F;
      enable-background:new    ;
    }
    .st10{
      opacity:0.5;
      fill:#EA5B0C;
      enable-background:new    ;
    }
  </style>
  <rect x="115.4" y="21.6" class="st0" width="745.7" height="84.2"/>
  <text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="st1 st2"> Rainbow Mirage
  </text>
  <g>
    <path class="st3" d="M21.6,80.2c-0.3-26,19.1-47.4,43.8-48.4C49,32.6,36.1,47,36.5,64.3c0.4,17.1,13.8,31.1,30.1,31.1
                         C83.7,95.5,97.4,80.8,97.1,63c-0.3-17.3-13.6-31.1-30-31.3c24.7,0,45,20.8,45.4,46.9c0.5,26.2-19.3,47.9-44.2,48.6
                         C43.1,128,21.9,106.7,21.6,80.2z"/>
    <path class="st4" d="M81.9,111.4c-24.7-0.1-44.8-21-45.2-46.9c0.5,17.2,13.9,31,30.4,31c16.3,0,29.8-13.9,30.3-31
                         c0.4-17.9-13.3-32.6-30.3-32.7c-16.4,0-29.9,13.7-30.3,30.8c0.5-26,20.7-46.8,45.5-46.8c25,0,45.2,21.2,45.4,47.3
                         C127.9,89.8,107.2,111.6,81.9,111.4z"/>
    <path class="st5" d="M112,40.3c4.2,29.1-16.7,54.3-43.6,55.2c16.4-0.7,29.4-14.9,29.1-32.3C97.3,46.1,84,32,67.6,31.9
                         c-17.1-0.2-30.9,14.3-30.7,32.2c0.2,17.3,13.4,31.2,29.8,31.5C42,95.4,21.9,74.4,21.6,48.4C21.3,19.7,45-3.3,73,0.4
                         C93,3,109,19.4,112,40.3z"/>
    <path class="st6" d="M52.5,15.9c24.7,0.3,44.7,21.3,44.9,47.2C97,45.9,83.7,32,67.2,31.9c-16.3-0.1-29.9,13.7-30.4,30.8
                         c-0.5,17.9,13.1,32.7,30.1,32.9c16.4,0.1,30-13.5,30.5-30.7c-0.6,26-21,46.7-45.8,46.5c-25-0.2-45.1-21.5-45.2-47.6
                         C6.3,37.3,27.2,15.6,52.5,15.9z"/>
    <path class="st7" d="M45.2,108.9c-17.7-18.1-18.4-47.7-1.6-66.7c-11,12.7-10.5,32.4,1.4,44.4c11.8,11.9,30.7,11.7,42.3-0.3
                         c12.2-12.6,12-33.2-0.2-45.6c-11.8-12-30.6-11.9-42.3,0.1c17.5-18.3,45.8-18.7,63.7-0.6c18,18.2,18.6,48.2,1.4,67.2
                         C92.6,126.7,63.3,127.4,45.2,108.9z"/>
    <path class="st8" d="M24.2,38.5c18.5-17.3,46.7-15.8,63.5,3.1C76.4,29.1,57.6,28.3,45.4,40C33.2,51.4,32,71.2,42.7,84.2
                         c11.1,13.6,30.7,14.9,43.3,3C98.2,75.7,99.4,56,88.9,43c16.2,19.6,14.5,49.3-4,66.7c-18.6,17.5-47.1,16-64-3.2
                         C3.8,86.9,5.3,56.1,24.2,38.5z"/>
    <path class="st9" d="M91.7,22.6c16.2,19.6,14.5,49.2-3.8,66.6c12-11.7,13-31.4,2.2-44.4c-10.8-12.9-29.6-14.4-42.2-3.4
                         c-13.1,11.5-14.6,32-3.4,45.4c10.8,13,29.5,14.5,42.1,3.6c-18.9,16.7-47.2,14.5-63.5-5.1C6.6,65.5,8.4,35.6,27,18.2
                         C45.9,0.5,75.2,2.5,91.7,22.6z"/>
    <path class="st10" d="M115.3,70.2c-11.1,27-41.6,36.7-64.8,22.6c14.2,8.5,32.4,3.6,41-11.2c8.5-14.7,4.2-34-9.5-43.2
                          c-14.4-9.7-33.5-5-42.3,10.2c-8.6,14.7-4.3,33.9,9.4,43.2C28.1,77.9,21.6,49,34.5,26.7C48.7,2.3,80.4-4.1,102.3,14.6
                          C117.9,28,123.3,50.8,115.3,70.2z"/>
  </g>
</svg>
<style type="text/css">
  .tx1{
    font-family:'Verdana';
  }
  .tx2{
    font-size:18.2376px;
  }
  .tx3{
    font-family:'Verdana'}
  .tx4{
    font-size:18.2376}
  .tx1{
    opacity:0.7}
  .tx5{
    font-size:29;
  }
  .tx6{
    opacity:0.5}
  .tx7{
    opacity:0.4}
  .tx8{
    opacity:0.3}
</style>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx3 tx5">Why
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx1 tx5">I
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx6 tx3 tx5">created
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx3 tx5 tx7">it
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx5 tx3 tx8">?
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2"> 
  for make this
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx3 tx4 tx8"> 
  HTML
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2"> used for examples for
</text>
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx7 tx3 tx2"> your
</text>
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2">websites and files.
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx3 tx5">How
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx1 tx5">I
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx6 tx3 tx5">created the
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx3 tx5 tx7">logo
</text>
<text transform="matrix(0.8662 0 0 1 117.3072)"class="tx5 tx3 tx8">?
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2"> 
  I was originally following a tutorial on
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx3 tx4 tx8"> 
  Adobe Illustrator
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2"> 
  about customizing a
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx3 tx4 tx8"> 
  font
</text>
<text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2"> 
but, drawed the first two circles and removed the central one  I changed idea and decided that i have to</text><text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx3 tx4 tx8"> 
change everything</text><text transform="matrix(0.8662 0 0 1 117.3076 78.072)" class="tx1 tx2"> 
and then i created the rainbow mirage, cool huh?