Xyris
@xyrisapp.bsky.social
Xyris is an SVG animation tool that uses SMIL to create fully self-contained animated SVGs, allowing you to embed them as easily as standard image formats like GIF, PNG, or JPG—no coding required.
Pinned
Xyris
@xyrisapp.bsky.social
· Nov 21
Meet Xyris - The no-code animation builder for stunning vector graphics
#SVG, #Animations, #WebAnimations, #MotionGraphics, #Xyris, #Lottie
#SVG, #Animations, #WebAnimations, #MotionGraphics, #Xyris, #Lottie
🎉 Shoutout to @nickipps.bsky.social from Square Kicker for creating an awesome tutorial on Xyris! Super helpful for both new and experienced users.
Check it out: www.youtube.com/watch?v=RtRp...
Huge thanks to Nick for creating and sharing this!
#Stencils #Xyris #SquareKicker #SVGAnimation
Check it out: www.youtube.com/watch?v=RtRp...
Huge thanks to Nick for creating and sharing this!
#Stencils #Xyris #SquareKicker #SVGAnimation
Create Custom Animated SVGs for Stencils
YouTube video by SquareKicker
www.youtube.com
September 13, 2025 at 9:19 AM
🎉 Shoutout to @nickipps.bsky.social from Square Kicker for creating an awesome tutorial on Xyris! Super helpful for both new and experienced users.
Check it out: www.youtube.com/watch?v=RtRp...
Huge thanks to Nick for creating and sharing this!
#Stencils #Xyris #SquareKicker #SVGAnimation
Check it out: www.youtube.com/watch?v=RtRp...
Huge thanks to Nick for creating and sharing this!
#Stencils #Xyris #SquareKicker #SVGAnimation
Learn how to create scroll-triggered SVG animations using Xyris and SMIL. Animate visually, control with simple JavaScript—no complex coding required. (link in comment)
#SVGAnimation #ScrollAnimation #WebDesign #JavaScript #XyrisApp #SVG #WebAnimation #CreativeCoding #SMILAnimation
#SVGAnimation #ScrollAnimation #WebDesign #JavaScript #XyrisApp #SVG #WebAnimation #CreativeCoding #SMILAnimation
June 15, 2025 at 9:09 AM
Learn how to create scroll-triggered SVG animations using Xyris and SMIL. Animate visually, control with simple JavaScript—no complex coding required. (link in comment)
#SVGAnimation #ScrollAnimation #WebDesign #JavaScript #XyrisApp #SVG #WebAnimation #CreativeCoding #SMILAnimation
#SVGAnimation #ScrollAnimation #WebDesign #JavaScript #XyrisApp #SVG #WebAnimation #CreativeCoding #SMILAnimation
Discover how to animate SVGs without using CSS or JavaScript by leveraging native SMIL animation: xyris.app/blog/how-to-...
#SVGAnimation, #Xyris, #SMIL, #cssanimation
#SVGAnimation, #Xyris, #SMIL, #cssanimation
June 6, 2025 at 4:35 PM
Discover how to animate SVGs without using CSS or JavaScript by leveraging native SMIL animation: xyris.app/blog/how-to-...
#SVGAnimation, #Xyris, #SMIL, #cssanimation
#SVGAnimation, #Xyris, #SMIL, #cssanimation
Discover the leading five free SVG illustration libraries offering high‑quality, customizable artwork for diverse projects.
#webdesignresources #unDraw #Storyset #IRADesign #DrawKit #SVGRepo
xyris.app/blog/top-5-f...
#webdesignresources #unDraw #Storyset #IRADesign #DrawKit #SVGRepo
xyris.app/blog/top-5-f...
Top 5 Free SVG Illustration Repositories for Web Designers and Developers in 2025
Discover the leading five free SVG illustration libraries offering high‑quality, customizable artwork for diverse projects—complete with licensing details, search features, and easy integration.
xyris.app
April 19, 2025 at 1:39 AM
Discover the leading five free SVG illustration libraries offering high‑quality, customizable artwork for diverse projects.
#webdesignresources #unDraw #Storyset #IRADesign #DrawKit #SVGRepo
xyris.app/blog/top-5-f...
#webdesignresources #unDraw #Storyset #IRADesign #DrawKit #SVGRepo
xyris.app/blog/top-5-f...
All the essential SVG animation techniques packed into one short video. #Xyris #SVGAnimation #MotionGraphics
youtu.be/Do_lw4SM6I8
youtu.be/Do_lw4SM6I8
All the essential SVG animation techniques.
YouTube video by Xyris
youtu.be
April 7, 2025 at 10:30 AM
All the essential SVG animation techniques packed into one short video. #Xyris #SVGAnimation #MotionGraphics
youtu.be/Do_lw4SM6I8
youtu.be/Do_lw4SM6I8
Discover the top features every SVG animation editor should have, from keyframe support and interactive animations to cloud collaboration and version history.
#SVGAnimation #SVGAnimator #MotionGraphics #SMIL
xyris.app/blog/top-10-...
#SVGAnimation #SVGAnimator #MotionGraphics #SMIL
xyris.app/blog/top-10-...
Top 10 Features Every SVG Animation Editor Should Have - Xyris - Free Online SVG Animator
Discover the top features every SVG animation editor should have, from keyframe support and interactive animations to cloud collaboration and version history.
xyris.app
March 7, 2025 at 12:36 PM
Discover the top features every SVG animation editor should have, from keyframe support and interactive animations to cloud collaboration and version history.
#SVGAnimation #SVGAnimator #MotionGraphics #SMIL
xyris.app/blog/top-10-...
#SVGAnimation #SVGAnimator #MotionGraphics #SMIL
xyris.app/blog/top-10-...
Compare SVG animations: CSS, SMIL, and JavaScript. Learn their pros, cons, and best uses.
xyris.app/blog/svg-ani...
#svganimation, #cssanimation, #webanimation, #xyris
xyris.app/blog/svg-ani...
#svganimation, #cssanimation, #webanimation, #xyris
SVG Animation Methods Compared: CSS, SMIL, and JavaScript - Xyris - Free Online SVG Animator
Compare SVG animations: CSS, SMIL, and JavaScript. Learn their pros, cons, and best uses.
xyris.app
March 5, 2025 at 2:37 PM
Compare SVG animations: CSS, SMIL, and JavaScript. Learn their pros, cons, and best uses.
xyris.app/blog/svg-ani...
#svganimation, #cssanimation, #webanimation, #xyris
xyris.app/blog/svg-ani...
#svganimation, #cssanimation, #webanimation, #xyris
Reposted by Xyris
I'm keen to give Xyris a go to see how easy it will be to make animations like this one which relies on a JS library. Looks like Xyris uses SMIL so it'll be more portable and simple to drop into websites.
February 27, 2025 at 11:18 PM
I'm keen to give Xyris a go to see how easy it will be to make animations like this one which relies on a JS library. Looks like Xyris uses SMIL so it'll be more portable and simple to drop into websites.
Reposted by Xyris
Animating calligraphy lettering with variable stroke widths is a little tricky, but I've got you covered.
www.motiontricks.com/svg-calligra...
#gsap #creativefeed #webanimation #animation
www.motiontricks.com/svg-calligra...
#gsap #creativefeed #webanimation #animation
February 24, 2025 at 9:31 PM
Animating calligraphy lettering with variable stroke widths is a little tricky, but I've got you covered.
www.motiontricks.com/svg-calligra...
#gsap #creativefeed #webanimation #animation
www.motiontricks.com/svg-calligra...
#gsap #creativefeed #webanimation #animation
Learn how to design and animate a glowing neon effect using filters in Xyris! This tutorial covers the basics of applying glow effects, animating colors and blur, and exporting your final design.
#xyris, #svganimation, #filteranimation, #neoneffect
youtu.be/oSpkdIA_Tqo
#xyris, #svganimation, #filteranimation, #neoneffect
youtu.be/oSpkdIA_Tqo
Create SVG Filter Animation - Animated Neon Effect | Xyris
YouTube video by Xyris
youtu.be
January 21, 2025 at 8:06 AM
Learn how to design and animate a glowing neon effect using filters in Xyris! This tutorial covers the basics of applying glow effects, animating colors and blur, and exporting your final design.
#xyris, #svganimation, #filteranimation, #neoneffect
youtu.be/oSpkdIA_Tqo
#xyris, #svganimation, #filteranimation, #neoneffect
youtu.be/oSpkdIA_Tqo
Welcome to this step-by-step tutorial on creating path morph animations in Xyris!
#xyristutorial #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #morphanimation #howtoanimate #morph
#xyristutorial #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #morphanimation #howtoanimate #morph
Create SVG Morph Animation | Xyris
YouTube video by Xyris
www.youtube.com
January 8, 2025 at 9:13 AM
Welcome to this step-by-step tutorial on creating path morph animations in Xyris!
#xyristutorial #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #morphanimation #howtoanimate #morph
#xyristutorial #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #morphanimation #howtoanimate #morph
Top 6 Creative Uses for SVG Animations in Modern Web Design
Top 6 Creative Uses for SVG Animations in Modern Web Design
Discover six creative ways SVG animations are transforming modern web design. From animated logos and dynamic backgrounds to microinteraction feedback and engaging illustrations, learn how these light...
xyris.app
January 3, 2025 at 4:14 PM
Top 6 Creative Uses for SVG Animations in Modern Web Design
Learn how to create a handwriting animation using Xyris!
#xyristutorial #handwritinganimation #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #strokeanimation #howtoanimate
#xyristutorial #handwritinganimation #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #strokeanimation #howtoanimate
Create SVG Path Stroke Animation | Xyris
YouTube video by Xyris
youtu.be
December 28, 2024 at 10:54 AM
Learn how to create a handwriting animation using Xyris!
#xyristutorial #handwritinganimation #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #strokeanimation #howtoanimate
#xyristutorial #handwritinganimation #motiongraphics #svganimation #designtutorial #animationtips #creativedesigns #xyris #graphicdesign #strokeanimation #howtoanimate
🎨❄️ Animate a winter sales promotion banner by adding rotation and translation effects to snowflakes.❄️✨
#xyris #animation #2danimation #transformanimation #tutorial #design #ux #ui #webdesign #graphicdesign #snowflakes #animationtutorial #webanimation #svganimation #vectorart #vectoranimation
#xyris #animation #2danimation #transformanimation #tutorial #design #ux #ui #webdesign #graphicdesign #snowflakes #animationtutorial #webanimation #svganimation #vectorart #vectoranimation
SVG Transform Animations | Xyris
YouTube video by Xyris
youtu.be
December 19, 2024 at 2:55 PM
🎨❄️ Animate a winter sales promotion banner by adding rotation and translation effects to snowflakes.❄️✨
#xyris #animation #2danimation #transformanimation #tutorial #design #ux #ui #webdesign #graphicdesign #snowflakes #animationtutorial #webanimation #svganimation #vectorart #vectoranimation
#xyris #animation #2danimation #transformanimation #tutorial #design #ux #ui #webdesign #graphicdesign #snowflakes #animationtutorial #webanimation #svganimation #vectorart #vectoranimation
Explore top visual tools and libraries for animating SVG logos seamlessly. From intuitive visual editors to powerful libraries, create scalable and engaging animations for the web.
#animatedlogo, #logoanimation, #motiongraphics, #smilanimation #animation, #svganimation, #webanimation, #motiondesign
#animatedlogo, #logoanimation, #motiongraphics, #smilanimation #animation, #svganimation, #webanimation, #motiondesign
The Best Tools for Creating Animated Logos | Xyris
Explore top visual tools and libraries for animating SVG logos seamlessly. From intuitive visual editors to powerful libraries, create scalable and engaging animations for the web.
xyris.app
December 17, 2024 at 3:46 PM
Explore top visual tools and libraries for animating SVG logos seamlessly. From intuitive visual editors to powerful libraries, create scalable and engaging animations for the web.
#animatedlogo, #logoanimation, #motiongraphics, #smilanimation #animation, #svganimation, #webanimation, #motiondesign
#animatedlogo, #logoanimation, #motiongraphics, #smilanimation #animation, #svganimation, #webanimation, #motiondesign
Learn how to create SVG motion path animations in Xyris without writing a single line of code!
#SVGAnimation #SVGMotionPath #MotionPathAnimation #Xyris #MotionDesign
#SVGAnimation #SVGMotionPath #MotionPathAnimation #Xyris #MotionDesign
Create SVG Motion Path Animation | Xyris
YouTube video by Xyris
www.youtube.com
December 16, 2024 at 5:05 AM
Learn how to create SVG motion path animations in Xyris without writing a single line of code!
#SVGAnimation #SVGMotionPath #MotionPathAnimation #Xyris #MotionDesign
#SVGAnimation #SVGMotionPath #MotionPathAnimation #Xyris #MotionDesign
Discover the ultimate guide to SVG animation techniques, including CSS, JavaScript, and SMIL. Learn about their capabilities and best use cases.
#SVGAnimation
#SMILAnimation
#CSSSVGAnimation
#JavaScriptSVGAnimation
#SVGAnimationTechniques
#AnimatingSVG
#BestSVGAnimationMethods
#SVGAnimation
#SMILAnimation
#CSSSVGAnimation
#JavaScriptSVGAnimation
#SVGAnimationTechniques
#AnimatingSVG
#BestSVGAnimationMethods
The Complete Guide to Animating SVG: Techniques and Tools - Xyris - The Animation Builder for Stunning Vector Graphics
Discover the ultimate guide to SVG animation techniques (CSS, JavaScript, and SMIL). Learn about their capabilities and best use cases.
xyris.app
December 14, 2024 at 9:54 AM
Discover the ultimate guide to SVG animation techniques, including CSS, JavaScript, and SMIL. Learn about their capabilities and best use cases.
#SVGAnimation
#SMILAnimation
#CSSSVGAnimation
#JavaScriptSVGAnimation
#SVGAnimationTechniques
#AnimatingSVG
#BestSVGAnimationMethods
#SVGAnimation
#SMILAnimation
#CSSSVGAnimation
#JavaScriptSVGAnimation
#SVGAnimationTechniques
#AnimatingSVG
#BestSVGAnimationMethods
🚀 Ready to bring your ideas to life with stunning animations? Check out our step-by-step tutorial on creating your first animation in Xyris—no coding required! 🎨✨ Perfect for beginners and creatives looking to explore SVG graphics.
#Xyris #SVG #NoCoding #MotionDesign #MotionGraphics #WebAnimation
#Xyris #SVG #NoCoding #MotionDesign #MotionGraphics #WebAnimation
Creating Your First SVG Animation | Xyris
YouTube video by Xyris
www.youtube.com
December 12, 2024 at 3:23 PM
🚀 Ready to bring your ideas to life with stunning animations? Check out our step-by-step tutorial on creating your first animation in Xyris—no coding required! 🎨✨ Perfect for beginners and creatives looking to explore SVG graphics.
#Xyris #SVG #NoCoding #MotionDesign #MotionGraphics #WebAnimation
#Xyris #SVG #NoCoding #MotionDesign #MotionGraphics #WebAnimation
As developers, we might spend hours crafting neon animated SVG effects with SMIL, but with Xyris, you can achieve the same results in just minutes, complete with SVG SMIL output.
#svg, #animation, #motiongraphics, #motiondesign, #SMIL, #Lottie, #blureffect, #neoneffect, #xyris
#svg, #animation, #motiongraphics, #motiondesign, #SMIL, #Lottie, #blureffect, #neoneffect, #xyris
December 3, 2024 at 12:15 PM
As developers, we might spend hours crafting neon animated SVG effects with SMIL, but with Xyris, you can achieve the same results in just minutes, complete with SVG SMIL output.
#svg, #animation, #motiongraphics, #motiondesign, #SMIL, #Lottie, #blureffect, #neoneffect, #xyris
#svg, #animation, #motiongraphics, #motiondesign, #SMIL, #Lottie, #blureffect, #neoneffect, #xyris
November 23, 2024 at 4:38 PM
Meet Xyris - The no-code animation builder for stunning vector graphics
#SVG, #Animations, #WebAnimations, #MotionGraphics, #Xyris, #Lottie
#SVG, #Animations, #WebAnimations, #MotionGraphics, #Xyris, #Lottie
November 21, 2024 at 1:53 AM
Meet Xyris - The no-code animation builder for stunning vector graphics
#SVG, #Animations, #WebAnimations, #MotionGraphics, #Xyris, #Lottie
#SVG, #Animations, #WebAnimations, #MotionGraphics, #Xyris, #Lottie