Horje
How to design HTML SVG Logo | HTML SVG Graphics Code
How to design HTML SVG Logo

Create HTML SVG Logo


Example of HTML SVG Logo

Follow the Example
index.html
Example: HTML
<svg height="130" width="500">
  <defs>
    <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1" />
      <stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1" />
    </linearGradient>
  </defs>
  <ellipse cx="100" cy="70" rx="85" ry="55" fill="url(#grad1)" />
  <text fill="#ffffff" font-size="45" font-family="Verdana" x="50" y="86">SVG</text>
  Sorry, your browser does not support inline SVG.
</svg>

Output should be:

Example of HTML SVG Logo

Full Example of HTML SVG Logo

Follow the Example
index.html
Example: HTML
<!DOCTYPE html>
<html>
<body>

<svg height="130" width="500">
  <defs>
    <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%"
      style="stop-color:rgb(255,255,0);stop-opacity:1" />
      <stop offset="100%"
      style="stop-color:rgb(255,0,0);stop-opacity:1" />
    </linearGradient>
  </defs>
  <ellipse cx="100" cy="70" rx="85" ry="55" fill="url(#grad1)" />
  <text fill="#ffffff" font-size="45" font-family="Verdana"
  x="50" y="86">SVG</text>
Sorry, your browser does not support inline SVG.
</svg>

</body>
</html>

Output should be:

Full Example of HTML SVG Logo



Read Full::
HTML SVG Graphics Code
Category:
HTML Code
Sub Category:
HTML SVG Graphics Code
Uploaded:
6 months ago
Uploaded by:
Admin
Views:
1

Related Articles
What is HTML SVG Graphics HTML SVG Graphics Code
How to create HTML <svg> Circle Element HTML SVG Graphics Code
How to create HTML SVG Rectangle HTML SVG Graphics Code
How to design HTML SVG Rounded Rectangle HTML SVG Graphics Code
How to design HTML SVG Star HTML SVG Graphics Code
How to design HTML SVG Logo HTML SVG Graphics Code
What are the Differences Between SVG and Canvas HTML SVG Graphics Code

Single Articles
Example of HTML SVG Logo
Full Example of HTML SVG Logo

Share on: