Import, Animate and Draw Scalable Vector Graphics
Import, animate and draw scalable vector graphics directly in the Godot Engine 2D using the Scalable Vector Shapes 2D plugin:
Summer update
While trying to move house, raising 2 kids, holding up the day job, I keep at it with my night job: adding features and fixing bugs.
To my great joy I’ve met a couple of new collaborators over the summer.
Inkscape Sync
Together with Flechette I made hot reloading possible with Inkscape pivot points:
Inching forward to SVG’s saved in Adobe Illustrator and other editors
Thanks to this great bug report quirky number formatting got fixed yesterday.
Keeping it future proof
And one other reporter tracks a lot of regressions and api breaks
Snapping to grid
In release 2.35 DigitalDesignDex and I realized snapping to grid:
Autumn Roadmap
And more requests are underway.
Major overhaul of bottom docks
DigitalDesignDex and I are now moving fast in redesigning the drawing experience, so if you’re curious, track the issue here:
opened 07:24AM - 05 Sep 26 UTC
documentation
requires refactor
visual design
epic
With all the new edit tools (pen, knife, brush, eraser, local translate/rotate/s… cale) we're running out of UI real-estate.
The buttons are also hard to find and hard to keep compatible because they're kind of hacked into Godot's native UI.
It's time to design a new tab in the bottom dock, completely dedicated to freehand drawing.
The existing "draw settings" dock is unintuitive and unsuitable.
Also, some settings like draw order, stroke and fill should be available in both the create shapes dock and the draw dock.
## List of follow-up tickets gathered so far:
The extras besides achieving __functional parity__ come here.
### in scope of this ticket
- [x] Implement the create ellipse mode (place an ellipse on click while mouse is over 2D editor viewport)
- [x] Right click / escape should 'cancel' ellipse placer (and probably also all other draw modes)[^1]
- [x] All edit/create mode buttons should be disabled unless a Node2D or Control node is selected
- [x] Selecting a `ScalableVectorShape2D` overrides the fill, stroke and collision settings in the bottom panel to match the selected shape
- [x] Changing the fill, stroke and collision in the bottom panel when a `ScalableVectorShape2D` is selected also changes the settings of the shape (unchecking also results in removing line/poly_stroke/polygon/collision_object)
- [x] do not change selected shape's properties when brush tool or pencil tool is selected
- [x] apply changes to __all__ selected ScalableVectorShape2D nodes via bottom dock
- [x] update color in real time via bottom dock
- [x] Sync up __all__ settings with the shape and vice/versa (they will be all be part of general settings, most probably)
- [ ] Sync up when the paint order is toggled using a combination of [`move_child`](https://docs.godotengine.org/en/stable/classes/class_node.html#class-node-method-move-child), [`get_index`](https://docs.godotengine.org/en/stable/classes/class_node.html#class-node-method-get-index) and [`get_child`](https://docs.godotengine.org/en/stable/classes/class_node.html#class-node-method-get-child)
- [ ] Make paint order toggle buttons match the effective paint order of the selected node (pick the first one that is valid)
- [ ] Implement the create rectangle mode (place a rectangle on click ...)
- [ ] the "keep drawing behavior" should become a general setting and be respected by all creation tools
- [ ] add settings for the Select mode that are similar to / the same as the most common fields in the inspector (they will be all be part of general settings, most probably)
- [ ] clean up icons in favour of the atlas
### out of scope of this ticket
- [ ] redesign the help tab to be more useful than just a row of video thumbnail links (see design by @DigitalDesignDex in comment below)
- [ ] Add the "set pivot" (set origin) button and turn it into an edit mode (does the same as the crosshair icon up top)
- [ ] add a bucket fill tool that simply sets the fill color to the currently configured color for creation (question: set stroke as well?)
- [ ] Redesign number inputs for narrow space (see design [video](https://github.com/user-attachments/assets/0559f70d-4cda-4f72-8560-2896f0a99427))
[^1]: cancelling is setting select mode
And follow this feature branch:
Looking forward to RuntimeCurveEditor2D!
And though we’re hard at work now, I’m already looking forward to join forces with @hatmix to finally make a nice generic 2D Curve Editor you could use in your game:
opened 02:13AM - 19 Sep 26 UTC
long spike
The Godot editor's curve control is editor-only and only usable from C++ modules… (AFAIK). Godot contributors have little interest in adding this as a runtime or even tool-script available feature -- https://github.com/godotengine/godot-proposals/issues/3244
There are other attempts at adding curve controls for special use-cases, but none appear to be a complete runtime solution.
* https://github.com/gilzoide/godot-cubic-bezier-controls (Godot 3 only)
Curve-editor-only attempts
* https://github.com/JtotheThree/godot_curve_editor
* https://github.com/BaconEggsRL/easing_curve
* https://thegodotbarn.com/contributions/snippet/803/in-game-curve-editor
I may have missed something or misunderstood the features of one of the above codebases, but AFAIK, there is no existing Godot 4 solution for general runtime curve-editing controls. It would be *very* cool if Scalable Vector Shapes were to implement them ⭐
Of course, I understand this might be outside the intended scope of the addon 😄
My specific use-case for such controls is to improve a semi-educational game I created, where players can use 2D curves to edit/design rollercoasters. https://hatmix.itch.io/gwj88
Here's a sample video of the in-game curve editing controls I implemented (rather badly).
https://github.com/user-attachments/assets/d99daf85-c5a0-49c4-810b-135a2eac127c
## proposed solution (draft)
- [ ] custom node type `RuntimeCurveEditor2D`,
- [ ] when its direct parent is a `Node2D` that has a `curve : Curve2D` assigned to it, renders interactable handles (implicitly supports Path2D and ScalableVectorShape2D)
- [ ] should be independent from this plugin so it can easily become its own plugin (asset)
- [ ] it will also have its own curve so it can handle Line2D, Polygon2D and CollisionPolygon2D as well.
- [ ] when an assigned Line2D, or Polgyon2D, etc already has points, my BasicFit curve fitting algorithm is applied to generate a curve approximation to work with
- [ ] ...
Pen pressure
And to my great joy I even think building in pen pressure support may be possible as the docs mention it in mouse events:
Looking forward to see how that works (once I’ve procured such a device).
Join the Fun!
Want a feature or a fix? Get involved! Meet me at the Discord:
3 Likes
conz3d
September 24, 2026, 8:27pm
2
The development is impressive. Haven’t tested it myself yet.
When I read pen pressure , how comparable is it to grease pencil in Blender ?
I don’t know.
It started out as yet another curve editor for lines but with svg importer, I heard about grease pencil later. I’m quite sure the in editor drawing has a long way to go still to truly match more professional software, but I’m inching forward.
1 Like
conz3d
September 24, 2026, 8:56pm
4
Earlier today I have watched this grease pencil talk from the ongoing BCON26 .
And the pencil 2D drawing has some similarities to your project.
1 Like
I will definitely take a look later. I think integrating with their 2D output formats similar to the Inkscape Sync would be the optimal way to go.
But in editor drawing is fun to work on as well.
2 Likes