Search

Items tagged with: SVG

I made some final tweaks to the #Tactile #SVG Bingo card output for both portrait and landscape modes, made the site responsive, pretty, and functional in light and dark modes with CSS, and am happy to release this further out into the world! Thanks to @ChanceyFleet for bringing this little project to me! Now anyone can make tactile and embossable Bingo Cards whenever they want! We can do so much nonvisually with just a little code and a means of tactile output! blindsvg.com/pages/projects/bi…

Tactile Bingo Card Generator

This form creates as many Tactile Bingo Card SVG files that you want and downloads them as a zip file.
blindsvg.com
#svg #tactile @ChanceyFleet

I don't think getting consistency with SVG's filters is going to be a problem. None of the implementations for em and ex are consistent. Percent is broken in a couple too, including Inkscape.

@federicomena Let me know if you want the SVG test file.

#inkscape #svg #w3c #firefox #browser #standards #vector

A bunch of squares on a white background, different again - Inkscape
A bunch of squares on a green background, different again again - librsvg
A bunch of squares on a green background - Firefox
A bunch of squares on a green background, different than the last one - Chromium
#firefox #browser #inkscape #w3c #standards #svg #vector @Federico Mena Quintero

Rough minutes from the #SVG session, if you were interested but couldn't call in:

w3.org/2025/03/26-svg-neglect-…

There will also be a video of Eric's opening presentation.

We didn't come up with any grand solutions in 1 hour, but I think there was a loose consensus on the following priorities:

- Getting a published SVG standard that is consistent with browser SVG implementations.
- Creating a comprehensive test suite to identify interop issues.
- Using smaller feature module specs in future.

Vectors of Neglect – 26 March 2025

www.w3.org
#svg

A reminder that if you're interested in #SVG and the #WebStandards process, and specifically about trying to get SVG standardization back into gear, there is an open meeting on the topic today. It's hosted by Eric Meyer ( @Meyerweb ) of Igalia, as part of W3C Breakouts Day.

Starts in 5.5 hours. You'll need a w3.org account to sign up; meeting is via zoom with irc chat.

w3.org/events/meetings/09b7b3f…


26 March 2025 | Vectors of Neglect | Calendar

The World Wide Web Consortium (W3C) is an international community where Member organizations, a full-time staff, and the public work together to develop Web standards.
W3C
#svg #webstandards @Eric A. Meyer

This fun little test scene is using #SVG textPath elements to make an arching caterpillar, some bees, and a trail of ants coming out of an anthill. Except all the bugs are made out of #braille that spells out the type of bug it's making up. Using the Braille36 Tiger font and using Unicode Braille Pattern characters for the braille itself to be visifle and embossable. It's really fun reading the braille in a non-standard way around the paper! #Blind #TactileGraphics #BlindSVG
A leaf made out of grey outlines and a stem is in the center of the drawing. On top of the leaf, the braille characters spelling out "caterpillar" are arched mimicking the body posture of a caterpillar inching along. An anthill is at the bottom of the drawing, with a line of braille ants coming out of it and marching down the side and along the ground. Two braille bees are in the upper right and lower right areas of the drawing, flying in different angles.
#blind #braille #svg #tactilegraphics #blindsvg

New entry in my “uses” page:

usvg is an SVG compiler, and one of the most under-appreciated tools I use. It compiles complex SVGs into simpler path-based SVGs. Edge-case SVGs may render incorrectly in some renderers (e.g. librsvg), but compiling them with usvg tends to iron these edge-cases out and make them more compatible. usvg is part of the resvg project, which is the most conformant SVG renderer I know of (and much smaller than librsvg if you include dependencies!).

I’ve sent all the SVGs on seirdy.one through usvg, and rasterized many of the emotes on pleroma.envs.net with resvg.

(sorry for the delete-redraft; I posted the wrong link and the link preview didn’t update when I edited!)

#SVG


Seirdy’s Home

My personal IndieWeb site. I write about and develop software to promote user autonomy. Topics include accessibility, security, privacy, and software freedom.
Seirdy’s Home
#svg

For those of you interested in learning how to teach #Blind and low-vision kids and adults #TactileDrawing techniques, #Coding basics, then building up to creating their own digital #SVG graphics for tactile output and beyond, the Tangible Art & Design Adventures curriculum is now live online! Come check out the TADA adventure and share it far and wide! tada.wssb.wa.gov/

Home - TADA! - CATT-NW

Tangible Art & Design Adventures by the Center for Assistive Technology Training Northwest, WSSB
tada.wssb.wa.gov
#blind #coding #svg #tactiledrawing

I launched my new #SVG Projects page today, including my SVBraille text file which lets you create properly formed braille in your file without external fonts! I put copious notes in the comments and on the Project page on how to set it all up, but if you can make SVG groups and know how to set up the Use element and can do a tiny bit of math, you are good to go! :) blindsvg.com/pages/projects/

SVG Projects - Blind SVG Study Guide

A compendium of SVG Projects put together to advance the state of tactile graphics and non-visual image creation.
blindsvg.com
#svg

#webdev #svg #nerd

#Accessibility #blind #svg #tactileart #tactilegraphics #low

A big update to SuperTinyIcons
github.com/edent/SuperTinyIcon…

Loads of #SVG icons for popular services - each one UNDER 1,024 bytes. Yup, less than a kilobyte each.

Take a look!


GitHub - edent/SuperTinyIcons: Under 1KB each! Super Tiny Icons are miniscule SVG versions of your favourite website and app logos

Under 1KB each! Super Tiny Icons are miniscule SVG versions of your favourite website and app logos - GitHub - edent/SuperTinyIcons: Under 1KB each! Super Tiny Icons are miniscule SVG versions of y...
GitHub
#svg

It is kinda fun to ask #ChatGPT to draw things as an #SVG. The SVG structure is pretty good, but the actual images are pretty useless. Least right now. I imagine this will change substantially in 2023.

Interesting to be able to assemble simple icon libraries with this technology in 2023.

Screenshot of bad SVG Icons for a web page.
#svg #chatgpt

#javascript #js #svg

#a11y #Accessibility #data #svg

Would love thoughts on how to improve the #SVG social media icons here (aside from deleting the Twitter link) codepen.io/mgifford-the-typesc…

We really need to make it easier for people to control social media icons and style them to meet their site. This really should be easy, accessible and susainable.

#SustyWeb #a11y #SocialMedia

#a11y #socialmedia #svg #sustyweb

It looks like a lot of organizations are going to need to update their #SocialMedia icons, so I decided to put up a few which include #mastodon.

My goal is to produce #SVG images that respect dark mode, can be easily styled with CSS, and also allow either circle, square or no background.

I want to embed best practices of accessibility, and web sustainability in this.

So what can I do to improve these?

codepen.io/mgifford-the-typesc…

#a11y #SustyWeb #DarkMode

#a11y #Mastodon #socialmedia #svg #darkmode #sustyweb

#images #RustLang #svg

And, finally (there’s so much more but I’ll stop raving now and get back to work), the web-related features, like a built-in accessibility and scripting panel and access to the SVG source, styling, etc.

If you’re creating illustrations for the web (or, heck, in general) and you’re not using this absolute gem of an app, you’re missing out :)

#svg #web #design #vector #illustration

Screenshot of a kitten illustration in Boxy SVG with the Meta panel showing with accessibility and scripting sections.
#illustration #design #web #svg #vector

And those little touches… notice how the curve that the selected Bézier control point is affecting is highlighted in purple. And you can simply pull along there to shape the curve instead of manipulating the control point handles.

Just beautiful.

#svg #foss #boxySVG #web #design #vector #illustration

Screenshot of kitten illustation in Boxy SVG showing a selected Bézier curve control handle with the outer curve of the kitten’s ear highlighted in purple. On the right, the Stroke panel is shwoing with settings for opacity, width, line cap and join shapes, etc.
#foss #illustration #design #web #svg #vector #boxySVG

#design #web #svg #illustation

#opensource #svg #icons

⇧