Free Developer Tool
SVG ViewBox Generator
Generate SVG viewBox attributes from coordinate and dimension values.
Generated viewBox
0 0 300 200
SVG markup
ViewBox:0 0 300 200
Aspect ratio:3:2
Coordinate size:300 × 200
Output size:600 × 400px
preserveAspectRatio:xMidYMid meet
What is SVG ViewBox Generator?
Generate an SVG viewBox value from its minimum coordinates, width and height. A correctly configured viewBox defines the coordinate system used to scale and display SVG graphics.
How to use
- Enter the minimum X and Y coordinates.
- Enter the viewBox width and height.
- Generate the viewBox value.
- Copy the generated attribute.
Features
- ViewBox generation
- Custom coordinate values
- Width and height controls
- Instant output
- Browser processing
Common Use Cases
- SVG development
- Responsive icons
- Custom illustrations
- SVG component creation
- Frontend development
Example
Input
ViewBox X: 0 ViewBox Y: 0 ViewBox width: 300 ViewBox height: 200
Output
viewBox="0 0 300 200"
FAQ
What does an SVG viewBox define?
The viewBox defines the coordinate system and dimensions used to scale and display SVG content.
Can the minimum coordinates be negative?
Yes. SVG viewBox values can use negative minimum X and Y coordinates.
Can the generated value be copied?
Yes.
Missing a feature?
If this tool doesn't cover your use case or is missing functionality, please let me know through the Contact page.
New improvements and features are added based on user feedback.