Cropping an SVG

I have started playing with SVG images and managed to convert a logo from EPS to SVG. I also managed to edit the file a bit with a text editor but I would like to crop the image to just the bare logo. GIMP will import an SVG but can’t export as SVG, and I can’t make head nor tail of the path in the SVG.

Any ideas how to crop the image? Thanks :slight_smile:

Maybe you could try Inkscape. :slight_smile:

1 Like

Hi there gandalf458,

does this help…

<!DOCTYPE HTML>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">

<title>untitled document</title>

<!--<link rel="stylesheet" href="screen.css" media="screen">-->

<style media="screen">
body {
    background-color: #f9f9f9;
    font: 100% / 162% verdana, arial, helvetica, sans-serif;
 }

.logo {
    width: 6.25em;
    height: 6.25em;
    margin: auto;
    background-color: #366;
 }
</style>

</head>
<body> 

<div class="logo">

<!--  previous viewbox value was "0 0 260 188"  -->
<!--  previous matrix value was "1.3333333,0,0,-1.3333333, 0, 188"  --> 

 <svg 
    xmlns="http://www.w3.org/2000/svg" 
    version="1.1" 
    viewBox="0 0 100 100">

  <g transform="matrix( 1.3333333,0,0,-1.3333333, -80, 144 )">
   <g transform="scale( 0.1 )">
    <path
      d="m 857.254,876.891 0.641,-25.887 64.351,0.508 v 6.238 l 2.774,2.77 42.789,42.789 6.683,6.687 6.688,-6.687 49.28,-49.278 2.75,-2.75 -0.02,-3.968 -0.85,-168.165 h 59.85 l 0.6,196.036 -118.622,118.621 z m -29.676,-291.11 v 62.117 l -2.75,-0.113 -2.906,2.906 -43.445,43.438 -6.684,6.691 6.684,6.68 47.984,47.977 6.684,2.773 h 169.535 v 62.84 L 801.754,821.391 684.742,704.379 803.34,585.781 Z m 264.822,-28.527 -59.82,0.492 0.39,-3.75 -3.16,-3.16 -43.447,-43.438 -6.683,-6.683 -6.684,6.683 -47.976,47.981 -2.774,6.684 v 163.66 h -64.09 l 0.602,-195.36 115.41,-115.41 118.852,118.86 z m 53.79,264.535 -24.14,0.418 v -65.016 l 2.64,-0.308 5.61,-2.699 41.5,-41.496 6.68,-6.684 -6.68,-6.688 -47.98,-47.976 -6.68,-2.738 -161.722,-0.372 v -59.941 l 191.172,-0.906 117,116.996 -117.4,117.41" fill="#fff"/>
    </g>
  </g>

 </svg>

</div>

</body>
</html>

coothead

3 Likes

Yes, thanks, I already had it installed but I cannot fathom it out even with tutorials!

Indeed it does, thanks. It seems so simple, it must be cheating! :rofl:

2 Likes

Actually the method that I use, which is usually very successful,
and one that I can fully recommend adding to one’s coding box
of tricks, is to simply practice " trial and error" techniques. :winky:

It certainly worked well for your little problem. :biggrin:

coothead

2 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.