<div class="left">
<p><strong><a href="https://www.pantone.com/color-of-the-year/2025">Visit the color of the year 2025 : </a></strong></p>
<p>Pantone : PANTONE 17-1230 Tcx</p>
<p>COLOR VALUES:</p>
<p>Hex : #a47864</p>
<p>Rgb : rgb(164,120,100)</p>
<p>Hsl : 19° , 26% , 52%</p>
<p>RgbaColor : rgba(164,120,100,1.00)</p>
<p>lab XyzColor : 24.327, 22.246, 15.068</p>
<p>HsvaColor : hsva(18.75,39.02%,64.31%,1)</p>
<p>HsvColor : 19° , 39% , 64%</p>
<p>CIE L*a*b* : 54.29, 14.5, 17.73</p>
</div>
<div class="right"> - L-system extension from Inkscape - </div>
<div class="right">Axiom : ++F</div>
<div class="right">Rule : F=FF-[+F-F-F]</div><div class="right"><svg    width="210mm"
   height="297mm"
   viewBox="0 0 210 297">
  <path class="line1"  style="fill:none;stroke:#A47864;stroke-width:1;stroke-miterlimit:5;" 
        d="m125.8,104.74l-2.52,-11.87l-2.53,-11.88l11.55,-3.76l3.76,11.55l-11.55,3.76m-3.76,-11.55l11.88,-2.53l11.88,-2.52l3.75,11.55l-11.55,3.75l-3.75,-11.55m11.55,-3.75l-11.55,3.75l-11.55,3.75l-4.94,-11.09l11.1,-4.94l4.93,11.09m-11.09,4.94l11.55,-3.75l11.55,-3.75l4.94,11.09l-11.09,4.94l-4.94,-11.09m11.09,-4.94l-11.55,3.75l-11.55,3.75l-4.94,-11.09l11.1,-4.94l4.93,11.09m12.01,-2.56l-11.88,2.52l-11.88,2.53l-3.75,-11.55l11.55,-3.76l3.75,11.55m-11.55,3.76l-2.52,-11.88l-2.53,-11.88l11.55,-3.75l3.76,11.55l-11.55,3.75m-3.76,-11.55l3.76,11.55l3.75,11.55l-11.1,4.94l-4.94,-11.1l11.1,-4.94m4.94,11.1l-3.75,-11.55l-3.76,-11.55l11.1,-4.94l4.94,11.09l-11.1,4.94m-4.94,-11.09l3.76,11.55l3.75,11.55l-11.1,4.94l-4.94,-11.1l11.1,-4.94m-2.57,-12l-11.55,3.75l-11.55,3.75l-4.94,-11.09l11.1,-4.94l4.94,11.1m-11.1,4.93l-3.75,-11.55l-3.75,-11.55l11.09,-4.93l4.94,11.09l-11.09,4.94m-4.94,-11.1l4.94,11.1l4.94,11.09l-10.52,6.08l-6.07,-10.52l10.51,-6.07m6.08,10.51l-4.94,-11.09l-4.94,-11.1l10.51,-6.07l6.08,10.52l-10.52,6.07m-6.07,-10.52l4.94,11.1l4.94,11.09l-10.52,6.08l-6.07,-10.52l10.51,-6.07m-3.8,-11.68l-11.55,3.76l-11.55,3.75l-4.94,-11.09l11.09,-4.94l4.94,11.09m-11.09,4.94l-3.76,-11.55l-3.75,-11.55l11.1,-4.94l4.94,11.1l-11.1,4.94m-4.94,-11.1l4.94,11.1l4.94,11.09l-10.52,6.07l-6.07,-10.52l10.52,-6.07m6.07,10.52l-4.94,-11.09l-4.94,-11.1l10.52,-6.07l6.07,10.52l-10.52,6.07m-6.07,-10.52l4.94,11.1l4.94,11.09l-10.52,6.07l-6.07,-10.52l10.52,-6.07m-3.81,-11.67l-11.55,3.75l-11.55,3.76l-4.94,-11.1l11.1,-4.94l4.94,11.1m-11.1,4.94l-3.75,-11.55l-3.75,-11.55l11.09,-4.94l4.94,11.09l-11.09,4.94m-4.94,-11.09l4.94,11.09l4.94,11.1l-10.52,6.07l-6.07,-10.52l10.51,-6.07m6.08,10.52l-4.94,-11.1l-4.94,-11.09l10.51,-6.08l6.08,10.52l-10.52,6.07m-6.07,-10.51l4.94,11.09l4.94,11.1l-10.52,6.07l-6.07,-10.52l10.51,-6.07" fill="none" id="path1" stroke="#a47864" stroke-width="3.95"/></g></svg></div>
body {
  color:#A47864;
  background-color:#000000;
  
}
body,
html {
 height: 100%;
 width: 100%;
 margin: 0;
 padding: 0;
}

div.left {
  float:left;
  width:50%;
  border-radius: 50%;
}
div.right {
  float:right;
  width:50%;
  background: -webkit-linear-gradient(45deg, #000000 0%,#FFFFFF 9%,#FF0000 55%,#00FF00 88%, #0000FF 90%);
    -moz-animation: Gradient 15s ease infinite;
  animation: Gradient 15s ease infinite;
}
svg {
  color:#A47864;
}
.line1
{
  stroke-dasharray: 58;
  animation: dash 19s linear ;
}
@keyframes dash {
  to {
    stroke-dashoffset: 220;
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.