I have created a header logo SVG in illustrator, using the code to insert it, and if zoomed in, it gets soft and pixeled.

1st Logo) The Top one is a SVG Code from Adobe Illustrator Inserted in HTML (Soft)

2nd Logo Is a PNG (soft)

3rd is Paramount SVG file pulled from their site

enter image description here

Don't know how to make it scale as Paramount Logo does. When zoomed in on. It stays clean, scales

My Code:

enter image description here.

Paramount Logo Code:

enter image description here

Any help or direction is appreciated.


1 Answer 1


The first piece of code is an SVG that just contains a raster image. It's not vector. Can you see all those random letters and numbers inside the Image tag? That's the raster image data.

The second is an SVG with vectors. It contains path data (i.e. vectors).

Placing a raster image into Illustrator then exporting as an SVG doesn't make it vector. To get a vector file, there are some possibilities:

  1. Recreate it by typing it, then convert the text to outlines. If there are graphical elements you may need to redraw them.

  2. If you have a good quality/high resolution raster image you may be able to get away with auto tracing it, although to be fair, auto tracing doesn't generally work very well with type.

  3. Try to find the original vector file, if one exists.

  • +1 data:image/ in the SVG markup is a tell tale sign the content is raster based.
    – Scott
    Mar 24, 2023 at 17:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.