Rainbow Mirage by @phantomium - Codewith.it

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

References

targetDetermina il comportamento di un collegamento ipertestuale alla sua apertura
maxImposta il valore numerico o temporale massimo per un elemento input
relServe a definire la relazione tra il documento e una risorsa.
hrefDefinisce l'URL della risorsa/pagina di destinazione.
formnovalidateImpedisce la convalida di un singolo elemento input
downloadConsente di scaricare file al click di collegamento ipertestuale.

Users

Log in to search for users

Explore

Find inspiration

Esercitazione 2

Twitchpage1confirm

INSERIMENTO IMMAGINI IN UN TESTO

Comunicare sul Web [Template CSS]

davidesimonteonline

Condizione esercizio 1

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?