nrw.social ist einer von vielen unabhängigen Mastodon-Servern, mit dem du dich im Fediverse beteiligen kannst.
Wir sind eine freundliche Mastodon Instanz aus Nordrhein-Westfalen. Ob NRW'ler oder NRW-Sympathifanten, jeder ist hier willkommen.

Serverstatistik:

2,8 Tsd.
aktive Profile

#svg

3 Beiträge3 Beteiligte0 Beiträge heute
Airports Bot<p>Stavanger Airport, Sola - Stavanger, Norway</p><p><a href="https://en.wikipedia.org/wiki/Stavanger_Airport,_Sola" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">en.wikipedia.org/wiki/Stavange</span><span class="invisible">r_Airport,_Sola</span></a><br><a href="https://www.openstreetmap.org/#map=13/58.876701/5.637780" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">openstreetmap.org/#map=13/58.8</span><span class="invisible">76701/5.637780</span></a></p><p><a href="https://mastodon.world/tags/ENZV" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ENZV</span></a> <a href="https://mastodon.world/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.world/tags/Stavanger" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Stavanger</span></a> <a href="https://mastodon.world/tags/Norway" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Norway</span></a> <a href="https://mastodon.world/tags/airport" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>airport</span></a> <a href="https://mastodon.world/tags/aviation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>aviation</span></a> <a href="https://mastodon.world/tags/avgeeks" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>avgeeks</span></a> <a href="https://mastodon.world/tags/GIS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>GIS</span></a></p>
Martin Owens :inkscape:<p>Ugh, I'm grinding gears on these PDF details. Context fill! from hell's heart I stab at thee!</p><p>At least I found some solid bugs in Inkscape's SVG rendering too. So there's that!</p><p><a href="https://floss.social/tags/inkscape" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>inkscape</span></a> <a href="https://floss.social/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> <a href="https://floss.social/tags/pdf" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>pdf</span></a></p>
Christopher Kirk-Nielsen<p>I wanted to make the backdrop of my website's menu (on mobile) be frosted glass, but with a rough texture. <a href="https://front-end.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> filter (with SVGFM: <a href="https://svgfm.chriskirknielsen.com/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">svgfm.chriskirknielsen.com/</span><span class="invisible"></span></a>, hashtag always be pluggin'), boom, done! Except Firefox is like "whoa not with `backdrop-filter`" (fine with `filter` though), and Safari still doesn't know what an inline SVG filter URL is. Boo. :( Time to file/find browser bugs…</p><p>Anyways, check out that texture — sure would love to ship it. 😢<br><a href="https://codepen.io/chriskirknielsen/pen/xbbbRKZ?editors=1100" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/chriskirknielsen/pe</span><span class="invisible">n/xbbbRKZ?editors=1100</span></a></p>
Christopher Kirk-Nielsen<p>While I'm not a huge fan of the verbosity of the syntax* here, this is very cool, and the basic demo is surprisingly impressive: <a href="https://webkit.org/blog/16794/the-css-shape-function/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">webkit.org/blog/16794/the-css-</span><span class="invisible">shape-function/</span></a></p><p>* Though to be fair: a) I don't remember all of <a href="https://front-end.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a>'s commands, and b) this does feel rather expressive and <a href="https://front-end.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a>-y (looking at you, `radial-gradient(circle at center in hsl longer hue, red, blue)`!)</p>
Rafael<p>Prismic.io has published a collection of lists for many types of css/javascript/svg driven animations to enhance your web apps' user experience. Each example includes real-world use cases and clear code examples in the appropriate languages.</p><p>The collection includes:</p><p>1. Text Animations<br>2. Hover Effects<br>3. Button Animations<br>4. Background Effects, and<br>5. Image Effects</p><p>"CSS Animation Collection: 150+ Examples &amp; Code"</p><p><a href="https://prismic.io/guides/css-animations" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">prismic.io/guides/css-animatio</span><span class="invisible">ns</span></a></p><p><a href="https://mastodon.social/tags/programming" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>programming</span></a> <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>css</span></a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>javascript</span></a> <a href="https://mastodon.social/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> <a href="https://mastodon.social/tags/html" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>html</span></a> <a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webdev</span></a></p>
Loufock Holmes<p>Coloring Richard Kiel as Jaws in James Bond</p><p><a href="https://mycreepycoloringbook.tchouk-tchouk.com/coloring/richard-kiel-as-jaws-in-james-bond-1977-79/66/?AUTO_PLAY=1#DarkSeaGreen,DarkOliveGreen,Turquoise,Cyan,OliveDrab" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">mycreepycoloringbook.tchouk-tc</span><span class="invisible">houk.com/coloring/richard-kiel-as-jaws-in-james-bond-1977-79/66/?AUTO_PLAY=1#DarkSeaGreen,DarkOliveGreen,Turquoise,Cyan,OliveDrab</span></a></p><p><a href="https://mastodon.social/tags/coloring" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>coloring</span></a> <a href="https://mastodon.social/tags/classichorror" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>classichorror</span></a> <a href="https://mastodon.social/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>javascript</span></a> <a href="https://mastodon.social/tags/vector" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>vector</span></a> <a href="https://mastodon.social/tags/graphics" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>graphics</span></a> <a href="https://mastodon.social/tags/jamesbond" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>jamesbond</span></a> <a href="https://mastodon.social/tags/jaws" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>jaws</span></a> <a href="https://mastodon.social/tags/richardkiel" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>richardkiel</span></a></p>
Loufock Holmes<p>Coloring Richard Kiel as Jaws in James Bond</p><p><a href="https://mycreepycoloringbook.tchouk-tchouk.com/coloring/richard-kiel-as-jaws-in-james-bond/66/?AUTO_PLAY=1#Chocolate,DimGray,White,PaleTurquoise,AliceBlue" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">mycreepycoloringbook.tchouk-tc</span><span class="invisible">houk.com/coloring/richard-kiel-as-jaws-in-james-bond/66/?AUTO_PLAY=1#Chocolate,DimGray,White,PaleTurquoise,AliceBlue</span></a></p><p><a href="https://mastodon.social/tags/coloring" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>coloring</span></a> <a href="https://mastodon.social/tags/classichorror" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>classichorror</span></a> <a href="https://mastodon.social/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>javascript</span></a> <a href="https://mastodon.social/tags/vector" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>vector</span></a> <a href="https://mastodon.social/tags/graphics" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>graphics</span></a> <a href="https://mastodon.social/tags/jamesbond" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>jamesbond</span></a> <a href="https://mastodon.social/tags/jaws" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>jaws</span></a> <a href="https://mastodon.social/tags/richardkiel" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>richardkiel</span></a></p>
David Bisset<p>Interesting:</p><p>OmniSVG is the first family of "end-to-end multimodal SVG generators" capable of generating complex and detailed SVGs ("from simple icons to intricate anime characters"). </p><p><a href="https://github.com/OmniSVG/OmniSVG" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">github.com/OmniSVG/OmniSVG</span><span class="invisible"></span></a></p><p><a href="https://phpc.social/tags/opensource" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>opensource</span></a> <a href="https://phpc.social/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webdev</span></a> <a href="https://phpc.social/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> <a href="https://phpc.social/tags/AI" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AI</span></a></p>
Mary Holstege<p><a href="https://mastodon.social/tags/GenerativeArt" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>GenerativeArt</span></a> interlude</p><p>More fun with integer sequences</p><p>Triangular Truchet tiling with integer sequences driving things</p><p>Flip sequence determines whether hypoteneuse runs down from left or up; swap sequence determines whether the pattern lays out from left or right.<br>Colour sequences determine colour advancement horizontally and vertically.</p><p>Loops</p><p><a href="https://mastodon.social/tags/XQuery" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>XQuery</span></a> <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.social/tags/CreativeCoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CreativeCoding</span></a></p>
Jürgen<p><span class="h-card" translate="no"><a href="https://merveilles.town/@thomasorus" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>thomasorus</span></a></span> was inspired when i saw it: renders with customizable strokes, colors and corner radii - did it in <a href="https://mastodon.social/tags/java" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>java</span></a></p><p>also outputs <a href="https://mastodon.social/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> - courtesy of <a href="https://mastodon.social/tags/batik" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>batik</span></a></p>
OTX Bot<p>Massive Surge in SVG Based Phishing</p><p>A new breed of phishing attacks is targeting web users using image files as delivery vehicles, according to a new report from Trustwave SpiderLabs and the firm that co-founded the security firm.</p><p>Pulse ID: 67fbb96ccb2b2cd5801ad78b<br>Pulse Link: <a href="https://otx.alienvault.com/pulse/67fbb96ccb2b2cd5801ad78b" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">otx.alienvault.com/pulse/67fbb</span><span class="invisible">96ccb2b2cd5801ad78b</span></a> <br>Pulse Author: cryptocti<br>Created: 2025-04-13 13:17:32</p><p>Be advised, this data is unverified and should be considered preliminary. Always do further verification.</p><p><a href="https://social.raytec.co/tags/CyberSecurity" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CyberSecurity</span></a> <a href="https://social.raytec.co/tags/InfoSec" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>InfoSec</span></a> <a href="https://social.raytec.co/tags/OTX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>OTX</span></a> <a href="https://social.raytec.co/tags/OpenThreatExchange" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>OpenThreatExchange</span></a> <a href="https://social.raytec.co/tags/Phishing" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Phishing</span></a> <a href="https://social.raytec.co/tags/Rust" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Rust</span></a> <a href="https://social.raytec.co/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://social.raytec.co/tags/bot" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>bot</span></a> <a href="https://social.raytec.co/tags/cryptocti" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>cryptocti</span></a></p>
Inautilo<p><a href="https://mastodon.social/tags/Design" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Design</span></a> <a href="https://mastodon.social/tags/Launches" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Launches</span></a><br>SVG Viewer · Edit, optimize, and convert SVGs, all on one site <a href="https://ilo.im/163721" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">ilo.im/163721</span><span class="invisible"></span></a></p><p>_____<br><a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.social/tags/Editor" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Editor</span></a> <a href="https://mastodon.social/tags/Optimizer" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Optimizer</span></a> <a href="https://mastodon.social/tags/Converter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Converter</span></a> <a href="https://mastodon.social/tags/ProductDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ProductDesign</span></a> <a href="https://mastodon.social/tags/UiDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UiDesign</span></a> <a href="https://mastodon.social/tags/WebDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDesign</span></a> <a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Development</span></a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDev</span></a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Frontend</span></a></p>
David Bisset<p>Some nice <a href="https://phpc.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> tricks. Animated "Knight Rider" bars, table of contents tweaks, and more.</p><p><a href="https://fuma-nama.vercel.app/blog/svg-art" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">fuma-nama.vercel.app/blog/svg-</span><span class="invisible">art</span></a></p><p><a href="https://phpc.social/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webdev</span></a> <a href="https://phpc.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://phpc.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a></p>
Lumiukko<p>Okay, so apparently <a href="https://metalhead.club/tags/drawIO" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>drawIO</span></a> does not export <a href="https://metalhead.club/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> as proper SVG..... the texts are embedded in some HTML elements... <br>Firefox can render it perfectly, but when using some tool like <a href="https://metalhead.club/tags/Inkscape" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Inkscape</span></a> , the text is a raster graphic.<br>When turning off font embedding and XML inclusion of the diagram within the SVG file, when exporting from drawIO, Inkscape can at least load the text as text, but it is weirdly truncated and does not stay within its bounds.</p><p>What the hell is this?</p><p>Edit: Pinging <span class="h-card" translate="no"><a href="https://hostux.social/@drawio" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>drawio</span></a></span> - perhaps you guys have an idea? :D</p><p><a href="https://metalhead.club/tags/Vector" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Vector</span></a> <a href="https://metalhead.club/tags/Figures" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Figures</span></a> <a href="https://metalhead.club/tags/Diagrams" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Diagrams</span></a></p>
Peter Kröner<p>So something in my build setup is _very_ clever and knows that the default value for the preserveAspectRatio <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> attribute is "xMidYMid meet". And therefore removes the attribute for production builds because of "performance" (as if this would make ANY difference). Problem is, there is a rather important CSS rule somewhere in the projects that selects for svg[preserveAspectRatio] and now everything's boken 🤪 </p><p><a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webdev</span></a></p>
Aral Balkan<p>New Kitten feature: Icons!</p><p>You can now make use of a subset of the icons in the Phosphor icons set by <span class="h-card" translate="no"><a href="https://typo.social/@minoraxis" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>minoraxis</span></a></span> and <span class="h-card" translate="no"><a href="https://hachyderm.io/@rektdeckard" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>rektdeckard</span></a></span>.</p><p><a href="https://kitten.small-web.org/reference/#icons" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">kitten.small-web.org/reference</span><span class="invisible">/#icons</span></a></p><p>Search through them in your editor by referencing `kitten.icons.categories` and `kitten.icons.tags`.</p><p>Add this to a file called index.page.js and run `kitten` to see a large duotone pink cat (because why not?):</p><p>export default function () {<br> return kitten.html`<br> &lt;${kitten.icons.c.Cat}<br> size=40%<br> weight=duotone<br> colour=deeppink<br> /&gt;<br> `<br>}</p><p>(And yes, the set includes icons for the fediverse. This one of the reasons I chose it.) ;)</p><p>Enjoy!</p><p>:kitten:💕</p><p><a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Kitten</span></a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SmallWeb</span></a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SmallTech</span></a> <a href="https://mastodon.ar.al/tags/icons" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>icons</span></a> <a href="https://mastodon.ar.al/tags/PhosphorIcons" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>PhosphorIcons</span></a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>web</span></a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>dev</span></a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>HTML</span></a> <a href="https://mastodon.ar.al/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://mastodon.ar.al/tags/JavaScript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>JavaScript</span></a> <a href="https://mastodon.ar.al/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.ar.al/tags/NodeJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>NodeJS</span></a> <a href="https://mastodon.ar.al/tags/authoring" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>authoring</span></a> <a href="https://mastodon.ar.al/tags/intellisense" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>intellisense</span></a></p>
Ana Tudor 🐯<p>A much newer <span class="h-card" translate="no"><a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>codepen</span></a></span> demo: smoothly connected cards <a href="https://codepen.io/thebabydino/pen/azbLBJy" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/thebabydino/pen/azb</span><span class="invisible">LBJy</span></a> - continuous backgrounds across all, concave roundings + drop shadows, responsivity.</p><p><a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.social/tags/filter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>filter</span></a> <a href="https://mastodon.social/tags/svgFilter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svgFilter</span></a> <a href="https://mastodon.social/tags/cssGradient" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>cssGradient</span></a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>web</span></a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webDev</span></a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>dev</span></a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webDevelopment</span></a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>code</span></a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>coding</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/CodePenChallenge" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CodePenChallenge</span></a></p>
Mary Holstege<p><a href="https://mastodon.social/tags/GenerativeArt" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>GenerativeArt</span></a> interlude</p><p>More fun with OEIS integer sequences.</p><p>Today we'll make some pseudospirals: a sequence of arcs with 90 degree turns in between, where the radii are driven off a sequence. Arcs may have a gain function applied. Negative radii flip direction.</p><p>A200437: Number of -n..n arrays x(0..9) of 10 elements with zero sum and no two or three adjacent elements summing to zero<br>Sequence negation (every 17th), no gain </p><p><a href="https://mastodon.social/tags/XQuery" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>XQuery</span></a> <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.social/tags/CreativeCoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CreativeCoding</span></a></p>
tonton<p>A <span class="h-card" translate="no"><a href="https://floss.social/@friction" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>friction</span></a></span> mograph test using text effect (a little too fast) ! </p><p>Here is the friction project if anyone wants to take a look ! <a href="https://e.pcloud.link/publink/show?code=XZ8IldZJIA7G6DSzW0dOOxx9Dt3g0q4kMM7" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">e.pcloud.link/publink/show?cod</span><span class="invisible">e=XZ8IldZJIA7G6DSzW0dOOxx9Dt3g0q4kMM7</span></a></p><p>Friction is an open source 2d animation software, which could replace <a href="https://mastodon.art/tags/aftereffect" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>aftereffect</span></a> </p><p>Unofficial discord <a href="https://discord.gg/FkjnM2r2JD" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">discord.gg/FkjnM2r2JD</span><span class="invisible"></span></a><br>Official page <a href="https://friction.graphics/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">friction.graphics/</span><span class="invisible"></span></a></p><p><a href="https://mastodon.art/tags/textanimation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>textanimation</span></a> <a href="https://mastodon.art/tags/motiongraphics" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>motiongraphics</span></a> <a href="https://mastodon.art/tags/motiondesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>motiondesign</span></a> <a href="https://mastodon.art/tags/mograph" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>mograph</span></a> <a href="https://mastodon.art/tags/animation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>animation</span></a> <a href="https://mastodon.art/tags/svg" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>svg</span></a> <a href="https://mastodon.art/tags/vector" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>vector</span></a> <a href="https://mastodon.art/tags/2d" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>2d</span></a> <a href="https://mastodon.art/tags/graphics" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>graphics</span></a> <a href="https://mastodon.art/tags/artWithOpenSource" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>artWithOpenSource</span></a> <a href="https://mastodon.art/tags/opensource" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>opensource</span></a> <a href="https://mastodon.art/tags/linux" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>linux</span></a> <a href="https://mastodon.art/tags/friction" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>friction</span></a> <a href="https://mastodon.art/tags/friction2d" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>friction2d</span></a> <a href="https://mastodon.art/tags/enve" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>enve</span></a> <a href="https://mastodon.art/tags/frictiongraphics" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frictiongraphics</span></a></p>
Mary Holstege<p><a href="https://mastodon.social/tags/GenerativeArt" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>GenerativeArt</span></a> interlude</p><p>Loops</p><p>1. Download sequence data from OEIS.org<br>2. Pick a random one<br>3. Take seq mod k to determine a turning angle from -90 to 90<br>4. Walk the sequence</p><p>Here we have k=5<br>A111569: a(n) = a(n-1)+a(n-3)+a(n-4) for n&gt;3, a(0)=-1, a(1)=1, a(2)= 2 a(3)=1<br>5 angles</p><p><a href="https://mastodon.social/tags/XQuery" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>XQuery</span></a> <a href="https://mastodon.social/tags/SVG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>SVG</span></a> <a href="https://mastodon.social/tags/CreativeCoding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CreativeCoding</span></a></p>