InautiloMay 5

#Development #Techniques
Passing your CSS theme to ‘canvas’ · How to adapt an HTML ‘canvas’ to user settings https://ilo.im/163mmy

_____
#HtmlCanvas #Themes #LightMode #DarkMode #Browser #WebDev #Frontend #HTML #CSS #JavaScript

Passing Your CSS Theme to `canvas` :: Aaron Gustafson

While working on a recent project I noticed an issue with a canvas-based audio visualization when I toggled between light and dark modes. When I’d originally set it up I was browsing in dark mode and the light visualization stroke showed up perfectly on the dark background, but it was invisible when viewed using the light theme (which I’d neglected to test). I searched around, but didn’t find any articles on easy ways to make canvas respond nicely to user preserences, so I thought I’d share (in brief) how I solved it.

Show thread[𝚜𝚒𝚍𝚗𝚎𝚢𝚜𝟷@~/𝚜𝚛𝚌]$​Dec 3

Also, if anyone else has HTML5 Canvas tips or tricks they'd like to share, I'd love to keep expanding that blog post!

#html5 #htmlcanvas #webdev #webgamedev

[𝚜𝚒𝚍𝚗𝚎𝚢𝚜𝟷@~/𝚜𝚛𝚌]$​Dec 2

I've published a new blog post with some tips and tricks I've learned for using the HTML5 Canvas element! Check it out:

https://sidneys1.com/programming/tips/2024/12/02/html5-canvas-tips.html

Want to comment? This Fediverse post also acts as my blog's comment functionality - public replies to this post will show on that post as comments. :)

#blog #programming #html5 #htmlcanvas #personalwebsite

HTML5 Canvas Tips

The <canvas> element may be the best thing to happen to HTML since <marquee>. I’ve been using it a lot for various projects recently and thought it’d be nice to collect some of the tips and tricks I’ve learned into once place.

Sidneys1.com
Mega “Byte” Matt Sep 29, 2024

Made a funky normal-map thing in HTML/JS. Source code is available!

https://mevanloon.github.io/normal-map-card/index.html

#javascript #htmlcanvas #opensource #normalmap

pablolarahJan 31, 2024
🦍 JavaScript Game Dev Tutorial – Build Gorillas with HTML Canvas + JavaScript
by Hunor Márton Borbély
@HunorBorbely at @freeCodeCamp
#HTMLcanvas #js #game
https://www.freecodecamp.org/news/gorillas-game-in-javascript/
JavaScript Game Dev Tutorial – Build Gorillas with HTML Canvas + JavaScript

In this JavaScript game tutorial, you'll learn how to create a modern version of the 1991 classic game Gorillas using plain JavaScript and the HTML canvas element. In this game, two gorillas throw explosive bananas at each other, and the first one to hit the other one wins the game.

freeCodeCamp.org
HANNΞ MAΞSNov 30, 2023

I open-sourced the code of my latest project: https://github.com/HanneMaes/hannemaes.be/blob/master/docs/persistent/quartz/01/index.html

Feel free to grab it, remix and play around!

#opensource #GitHub #behindthescenes #bts #tezos #b3d #tezosart #tez #b3d #blender #blender3D #htmlart #webart #midjourney #midjourneyartwork #art #DigitalArt #ArtistsOnMatsodon #FediArt #MastoArt
#AiArtists #AI #AiArt #AiAssistedArt #Remix #CreativeCoding #htmlcanvas #js #javascript

hannemaes.be/docs/persistent/quartz/01/index.html at master · HanneMaes/hannemaes.be

hannemaes.com & hannemaes.be. Contribute to HanneMaes/hannemaes.be development by creating an account on GitHub.

GitHub
pablolarahOct 4, 2023

🟥 Atrament.js
by Jakub Fiala ig: fiala__
A small JS library for beautiful drawing and handwriting on the HTML Canvas.
#javascript #drawing #graphics #htmlcanvas #webdev

https://github.com/jakubfiala/atrament.js

GitHub - jakubfiala/atrament.js: A small JS library for beautiful drawing and handwriting on the HTML Canvas.

A small JS library for beautiful drawing and handwriting on the HTML Canvas. - GitHub - jakubfiala/atrament.js: A small JS library for beautiful drawing and handwriting on the HTML Canvas.

GitHub
SoméDec 25, 2022

Learning about the Google Closure Compiler + #ClojureScript. I thought using HTML Canvas alone would make for a smaller payload, considering minified P5 is 877KB(!), but turns out GClosure's aggressive optimization makes the payload with #P5 just as small.

#p5js #clojure #creativecoding #programming #HTMLcanvas

Jan 🦊 - Grüner SpinnerDec 9, 2022
I learned how to use #HTMLcanvas today and feel very good about that! Used it to make a fillable progress track for #IronswornStarforged or #Ironsworn.
When I have time I want to save the state of the track to a cookie, so you could easily come back to a session.