Advertisement
Guest User

Untitled

a guest
Dec 22nd, 2014
145
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.63 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Gradient following path stroke</title>
  6. <style>
  7. svg {
  8. outline: 1px solid #ababab;
  9. }
  10. .line {
  11. fill: none;
  12. stroke: url(#stroke-gradient);
  13. stroke-width: 3;
  14. }
  15. </style>
  16. </head>
  17. <body>
  18.  
  19. <svg width="700" height="300">
  20. <defs>
  21. <linearGradient id="stroke-gradient">
  22. <stop offset="0%" stop-color="#ED3585"/>
  23. <stop offset="100%" stop-color="#6B35C8" />
  24. </linearGradient>
  25. </defs>
  26. <path class="line" transform="translate(0, 100)" d="M11,13.827814569536418L20,6.145695364238416L29,0L38,7.682119205298001L47,0L56,6.145695364238416L65,10.754966887417222L74,10.754966887417222L83,6.145695364238416L92,10.754966887417222L101,15.364238410596027L110,12.291390728476832L119,4.609271523178806L128,7.682119205298001L137,12.291390728476832L146,10.754966887417222L155,13.827814569536418L164,12.291390728476832L173,9.218543046357611L182,1.5364238410596105L191,9.218543046357611L200,15.364238410596027L209,21.509933774834444L218,23.046357615894028L227,30.728476821192054L236,38.410596026490055L245,32.26490066225166L254,27.65562913907286L263,29.192052980132445L272,27.65562913907286L281,29.192052980132445L290,30.728476821192054L299,38.410596026490055L308,43.01986754966886L317,39.94701986754967L326,41.48344370860928L335,46.092715231788084L344,50.70198675496689L353,53.774834437086085L362,59.9205298013245L371,64.52980132450331L380,62.99337748344372L389,55.311258278145694L398,53.774834437086085L407,52.2384105960265L416,56.8476821192053L425,55.311258278145694L434,49.16556291390728L443,46.092715231788084L452,53.774834437086085L461,59.9205298013245L470,67.60264900662253L479,70.67549668874172L488,66.06622516556291L497,64.52980132450331L506,67.60264900662253L515,62.99337748344372L524,69.13907284768212L533,76.82119205298014L542,84.50331125827815L551,92.18543046357617L560,84.50331125827815L569,90.64900662251655L578,90.64900662251655L587,86.03973509933775L596,86.03973509933775L605,81.43046357615894L614,86.03973509933775L623,79.89403973509934L632,87.57615894039736L641,86.03973509933775L650,87.57615894039736L659,84.50331125827815L668,92.18543046357617L677,93.72185430463576L686,87.57615894039736L695,82.96688741721856L704,79.89403973509934L713,84.50331125827815L722,87.57615894039736L731,90.64900662251655L740,90.64900662251655L749,92.18543046357617L758,84.50331125827815L767,90.64900662251655L776,87.57615894039736L785,87.57615894039736L794,87.57615894039736L803,90.64900662251655L812,93.72185430463576L821,101.40397350993378L830,99.86754966887416" stroke-dasharray="930.8463745117188 930.8463745117188" stroke-dashoffset="0"></path>
  27. </svg>
  28.  
  29.  
  30.  
  31. </body>
  32. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement