Sign in

Raphaël Améaume

@raphaelameaume.com
461 followers 313 following 147 posts

Freelance Creative Technologist. Building Fragment, a web development environment for creative coding. he/him raphaelameaume.com fragment.tools

PostsRepliesMedia
Raphaël Améaume @raphaelameaume.com · 09/09/2026
Started working on two new input types for Fragment over the weekend Link will look just like a button but use the correct html tag so you don't have to do weird bits to link to something A prop with params.options will be able to render either to a select (current behaviour) or a radio group
010
Raphaël Améaume @raphaelameaume.com · 30/07/2026
Glitches from a debug view for grid subdivisions #madewithfragment
190
Raphaël Améaume @raphaelameaume.com · 15/06/2026
I made a tool over the weekend to create and export gradient textures which use different color spaces for color interpolation. If you ever felt Figma could do a better job at this, then this is for you gradients.fragment.tools
110
Raphaël Améaume @raphaelameaume.com · 13/06/2026
It also feels like the colors you give it are more accurately represented. For example that's a gradient going from blue to yellow. In sRGB you end up with this purple that you never asked for in the first place. The bottom one actually looks like a gradient from blue to yellow
220
Raphaël Améaume @raphaelameaume.com · 13/06/2026
Looks better in my opinion in a lot of cases! If you take the original gradient which has stops at 0, 50%, 100%, it feels to me like those positions are better reflected in OKLab than in rgb where in sRGB the pink feels a lot more present than the blue
230
Raphaël Améaume @raphaelameaume.com · 23/04/2026
Video of the issue
000
Raphaël Améaume @raphaelameaume.com · 07/04/2026
Svelte help needed 👋 I'm building a Gradient input for Fragment and I'm running into issues. When in focus of an input in a list, I want to reorder that list based on gradients stops but when two stops have the same values, the UI freezes if I'm in focus. See how it breaks at the end?
211
Raphaël Améaume @raphaelameaume.com · 01/04/2026
Playing with sphere and scales using heerich.js #madewithfragment
020
Raphaël Améaume @raphaelameaume.com · 01/04/2026
Rendering @meodai.bsky.social heerich library with Fragment
221
Raphaël Améaume @raphaelameaume.com · 10/03/2026
Fantastic article, thanks for sharing! Fyi the first codepen link is broken, seems like some of the following text ended up in the href
110
Raphaël Améaume @raphaelameaume.com · 04/03/2026
wip: Git support in Fragment With a single keyboard shortcut, you'll be able to create a commit with your changes + a screenshot + a JSON of props at the time of the export (in case they were changed in the browser) #generativeart #creativecoding #madewithfragment
Screenshot of GitHub UI, showing a "fragment-auto-commit" which contains changes for sketch files, a screenshot and a JSON file containing prop values at the time of the export
030
Raphaël Améaume @raphaelameaume.com · 08/02/2026
Coming soon in Fragment: editing colour palettes on the fly ✨ When you pass an array of colours as sketch props, you'll get an automatic palette editor, with support for edition, addition and deletion from props parameters. #madewithfragment
162
Raphaël Améaume @raphaelameaume.com · 23/01/2026
Genuary 08 - City #genuary #genuary8 #genuary2026 #madewithfragment
041
Raphaël Améaume @raphaelameaume.com · 22/01/2026
Genuary 07 - Boolean Algebra #genuary #genuary2026 #genuary7 #madewithfragment
062
Raphaël Améaume @raphaelameaume.com · 16/01/2026
Genuary 06 - Lights on/off Quick 2d sketch for that one, not sure about the result but I need to catch up! #genuary #genuary6 #genuary2026 #madewithfragment
031
Raphaël Améaume @raphaelameaume.com · 10/01/2026
Genuary 05 - Write Genuary without using a font Exported SVG of my handwriting from @tldraw.com, using it as a texture source in WebGL. Could have been a fragment shader but my original idea was different so that's a lot of instanced planes #genuary #genuary2026 #genuary5 #madewithfragment
071
Raphaël Améaume @raphaelameaume.com · 05/01/2026
Genuary 04 - Low res Low resolution analog postcards from my trip to Japan last year #genuary #genuary2026 #genuary4 #madewithfragment
161
Raphaël Améaume @raphaelameaume.com · 04/01/2026
Genuary 03 - Fibonacci forever Regular dodecahedron and some periodic movement based on the Fibonacci sequence. #genuary #genuary3 #genuary2026 #madewithfragment
030
Raphaël Améaume @raphaelameaume.com · 03/01/2026
Genuary 02 - Twelve principles of animation #genuary #genuary2 #genuary2026 #madewithfragment Live version in the link below ⬇️
120
Raphaël Améaume @raphaelameaume.com · 01/01/2026
Genuary 01 - One color, one shape
130
Raphaël Améaume @raphaelameaume.com · 12/12/2025
010
Raphaël Améaume @raphaelameaume.com · 26/11/2025
040
Raphaël Améaume @raphaelameaume.com · 20/10/2025
Discovered the work of Lygia Pape over the weekend, through the "Minimal" exhibition at Bourse de Commerce in Paris. Love at first sight
030
Raphaël Améaume @raphaelameaume.com · 09/09/2025
While I have always tried to keep the number of dependencies low, this investigation shows that there is still room for improvement there. Starting with glslify 👀
Screenshot of fragment dependencies list using https://node-modules.dev/ showing top level dependencies have a small number of dependencies except for glslify and body-parser
010
Raphaël Améaume @raphaelameaume.com · 03/09/2025
Math visualisation for an upcoming installation I'm working on. Compute the shortest distance between a 2D point and a curved path made of two segments and a quadratic bezier curve then project the point on path with linear interpolation. #madewithfragment
060
Raphaël Améaume @raphaelameaume.com · 20/05/2025
Started following @e18e.dev and felt like it was time to look into the size of the fragment-tools package! Happy with the results!
Side by side comparison of the details of the NPM package "fragment-tools" between and after the latest release, emphasising the difference in unpacked size from 1.65MB to 548kB.
0121
Raphaël Améaume @raphaelameaume.com · 14/05/2025
Less than 12 hours left to get access to ThreeTools beta, a Chrome extension to inspect and tweak any @threejs.org website in realtime in the browser. → three.tools
150
Raphaël Améaume @raphaelameaume.com · 17/04/2025
I added support for @threejs.org Lights and Cameras to ThreeTools over the last weeks, available now for all beta users! It means you can now tweak your lights in realtime to make your scene look even better ✨ three.tools
1183
Raphaël Améaume @raphaelameaume.com · 27/03/2025
Props groups 🖖 Props can also be organised with groups! Groups are subsets of props that can be displayed in different modules. props.color.group = "cubes"; Thanks to this, you can organise the layout to better reflect your workflow by having props wherever you want them to be. Demo ⬇️
100
Raphaël Améaume @raphaelameaume.com · 26/03/2025
Props folders 🗄️ After many unsuccessful attempts in the past years, I finally managed to make folders work as I wanted, thanks to @svelte.dev runes and snippets! props.color.folder = "materials"; And it's fully reactive like any other props attributes! Docs: github.com/raphaelameau...
151
Raphaël Améaume @raphaelameaume.com · 25/03/2025
Reactive props ⚡ Props are now reactive by default! You can update a prop value in your code and the UI will react accordingly. And it works with any prop attributes! This brings a whole new dimension to Fragment as you can also create props on the fly and build reactive interfaces! Demo ⬇️
130
Raphaël Améaume @raphaelameaume.com · 24/03/2025
Props persistence 💫 Props values are now persisted across refreshes through local storage. They will only get overridden if you change their initial values in the code.
151
Raphaël Améaume @raphaelameaume.com · 05/02/2025
Great write-up (as usual ✨)! Love the woven crochet effect and the Lego one! I used the same technique to create the image filter for the Institute of Design raphaelameaume.com/work/institu...
140