Recent searches
Search options
#svg
42 posts28 participants2 posts today
Okay, i was annoyed again, so I did a thing:
Windows doesn't previews .svg files by default in the windows explorer.
I needed some svg files for the AutoSizeText project https://github.com/SpielmannSpiel/AutoSizeText to create a new icon for it.
So I made an image viewer in @godotengine ^^"
Is anyone interested in such a thing? maybe even as a tool in #PEBI?
I think open sourcing this might also be a good idea.
Saw the header here https://mastodon.social/@sturobson@front-end.social/114279126167674533 and had to make a version that works without JS, works with image backgrounds behind the header, works for any level of page zoom and is fully flexible when it comes to following the text wrapping on resize.
Play with it on @codepen https://codepen.io/thebabydino/pen/MYWxeew
Jebus.. #Python and all it's batteries. So #Matplotlib knows how to talk #SVG already. I just started to speculate on how hard that would be to implement and.. it's already there built into Matplotlib.
Well. That worked out rather nicely then.
Being back working in Python feels way too magical at times.
Turns out the mechanisms I'd already put in can do graphs and plots already with clean readable markdown - no new plumbing needed.
I'd have thought that a far-fetched goal moments ago.
Continued thread
Little progress with the vector graphics of the LGBTQIA.space mastodon.
Still to finish: one planet, two asteroids, the scarf trimmings and a lot of stars.
#vectorgraphics #svg #workinprogress #lgbtqia
I published my Unknown Letters tool to create line typography for plotters. Here it is:
https://unknownletters.m05.de
https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Element/feDropShadow
The <feDropShadow> SVG filter primitive creates a drop shadow of the input image. It can only be used inside a <filter> element.
MDN Web Docs<feDropShadow> - SVG: Scalable Vector Graphics | MDNThe <feDropShadow> SVG filter primitive creates a drop shadow of the input image. It can only be used inside a <filter> element.
➤ 簡化 SVG 互動插圖開發流程
✤ https://svggles.vercel.app/
Svggles 是一個 React 工具包，專門用來使用 SVG 創建互動式插圖。它提供了一系列功能，例如動畫效果（發光、旋轉、形變）和互動行為（滑鼠追蹤、滾動觸發），方便開發者快速製作引人注目的視覺效果。Svggles 已經發布為 npm 上的 `interactive-illustrations` 套件，方便安裝和使用。
+ 哇，這個套件看起來很棒！對想用 SVG 做出一些特別效果的開發者來說，簡直是救星。
+ 之前用 SVG 實現互動效果一直很麻煩，有了 Svggles 應該能大大提高效率。
#JavaScript #React #SVG #開發工具
svggles.vercel.appVite + React + TS
How would you create this in such a way that its individual parts can be scaled independently, including via #CSS animations/ transitions?
Here's my take on it https://www.reddit.com/r/css/comments/1jp1cgu/comment/mkw30mh/
Single `img` element squircle + inner shadow with #SVG #filter magic 
Check it out on @codepen https://codepen.io/thebabydino/pen/MYgNgBa
Continued thread
A relire : Plus de 300 000 logos vectoriels sur SeekLogo
https://blog.shevarezo.fr/post/2020/04/15/seeklogo-plus-de-300-000-logos-vectoriels
ShevArezo`Blog · Plus de 300 000 logos vectoriels sur SeekLogo - WebDesign - ShevArezo`BlogTrouver des logos de marques peut s'avérer pénible d'autant plus au format vectoriel. Seek Logo est un moteur de recherche contenant plus de 300 000 logos vectoriels ! - ShevArezo`Blog
Continued thread
Here's a gradient background version on @codepen too https://codepen.io/thebabydino/pen/KwKrJGp
Shape depends on how the text content naturally wraps.
GIF
#Development #Launches
Toon Titles · Cartoon titles brought to life with CSS, SVG, and SMIL https://ilo.im/1632jj
_____
#Collection #Cartoons #Animations #Design #WebDesign #WebDev #Frontend #SMIL #SVG #CSS
ilo.imAndy Clarke’s Toon Titles
Continued thread
This effectively pushes all pixels except for those with alphas originally in the [.4, .6] interval (which now stretch across the [0, 1] interval) to either 0 or 1, whichever is closer.
Now you may be wondering why not do this from the start instead of those first two primitives.
Well, because without knowing the blur radius in px (something that's not really possible without JS if we set it in container query or viewport units), we can't know what interval to map to.
