---
title: "Discussion on \"The Interactive Guide to SVGs: Viewport, ViewBox and PreserveAspectRatio\" | Hashnode"
description: "Discussion on \"The Interactive Guide to SVGs: Viewport, ViewBox and PreserveAspectRatio\". What are SVGs?\nScalable Vector Graphics (SVG) are a method computers use to describe an image. Just like any other image format.\nUnlike many other image formats, the SVG format is text-based. More precisely, SVGs are XML-based. This opens up how we c..."
url: "https://hashnode.com/posts/the-interactive-guide-to-svgs-viewport-viewbox-and-preserveaspectratio/63189fe36b34d71380daad48"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [The Interactive Guide to SVGs: Viewport, ViewBox and PreserveAspectRatio](https://blog.noelcserepy.com/the-interactive-guide-to-svgs-viewport-viewbox-and-preserveaspectratio?utm_source=hashnode&utm_medium=feed)

What are SVGs? Scalable Vector Graphics (SVG) are a method computers use to describe an image. Just like any other image format. Unlike many other image formats, the SVG format is text-based. More precisely, SVGs are XML-based. This opens up how we c...

Sep 7, 2022 · 10 min read · blog.noelcserepy.com  
Updated Jan 29, 2023  
Read the article

-   [#svg](https://hashnode.com/tag/svg)
-   [#web-development](https://hashnode.com/tag/web-development)
-   [#graphic-design](https://hashnode.com/tag/graphic-design)
-   [#html5](https://hashnode.com/tag/html5)
-   [#css](https://hashnode.com/tag/css)

## Written by

[Noël Cserépy](https://hashnode.com/@noelcserepy)

@noelcserepy · Zürich, CH

  
[View profile](https://hashnode.com/@noelcserepy)

I build animated web apps with NextJS and Framer Motion.

I build animated web apps with NextJS and Framer Motion.

## Responses 1

Markdown supported · ⌘↵ to post

[Richard Hayman-Joyce](https://hashnode.com/@latedeveloper)

[Apr 19, 2024](https://hashnode.com/posts/the-interactive-guide-to-svgs-viewport-viewbox-and-preserveaspectratio/63189fe36b34d71380daad48/comment/66223be521e7860d4a800fbb)

Great article. Been struggling to get my head around viewPort and viewBox for a while. This article, with it's animated figures, finally crystallized my understanding. Very appreciative.
