Web resources
Links
- turbolinks - Integrates with SSR sites. Improves page navigation speed by swapping in the body and merging the head tags, without a full page load.
- Stimulus - Modest JS framework for the HTML you already have.
- https://htmldom.dev/ - Reference: managing HTML DOM using vanilla JS
- https://roughnotation.com/ - JS library to create and animate annotations with a hand-drawn look
- How it works https://shihn.ca/posts/2020/roughjs-algorithms/
- https://riccardoscalco.it/textures/ - Fill SVGs with a texture
- https://nodesign.dev/ - A collection of tools for developers who have little to no artistic talent.
- https://refactoringui.com/ - Learn about UI/UX design
- https://tablericons.com/ - SVG icons, MIT license
- How to pick more beautiful colors for your data visualizations
- ColorBrewer - Color advice for maps (and other data representations)
- Svelte
- HeroPatterns - subtle background patterns
- SVG waves
- Synthesizing drum sounds with the Web Audio API
- An Interactive Guide to CSS Transitions
- Readability javascript bookmarklet
- Fontjoy - Font pairings
- unDraw - Open source illustrations
- https://philippta.github.io/web-frontends-in-go/
- CSS shadow palette generator
- CSS gradient generator - related article
- Paper CSS
- Classless.de – another classless CSS framework
- simplestatistics.org – Simple Statistics is a JavaScript library that implements statistical methods
- Papa Parse – CSV parser for the browser
- kill-sticky – Bookmarklet to remove sticky HTML elements.
- blurhash
- Tree views in CSS
- HyperUI – Free tailwind components
- When to use CSS grid vs flexbox
Charting libraries
- uPlot (demos)– Focused on performance.
- Plotly.js
- Highcharts – Quite heavyweight library. Does a lot of things. Probably not a good choice for simple use-cases.
- Vega Lite – Simple, non interactive.
- RoughViz – JS library for handdrawn looking charts
- Chart.js
Fonts
Some fonts that I like.
Serif fonts:
- PT Serif
- Noto Serif
- Merriweather
Sans-serif fonts:
- Fira Sans Condensed (for subtitles)
- Patrick Hand (comic sans -ish)
- Lato (thick, blocky)
Monospace:
- Monocraft - Minecraft inspired pixellated font. I think it’ll look good in retro-inspired user interfaces. Like a design based around ncurses.