Susam's Graphics Pages

Colour Contrast Calculator

2025-04-06T00:00:00Z

A simple web-based tool to calculate the contrast between two colours according to WCAG contrast formula.

Read on website | #html | #web | #graphics

XOR Map

2025-03-11T00:00:00Z

A simple HTML page that plots bitwise-XOR x and y for each coordinate (x, y) with the coordinate (0, 0) at the bottom-left corner.

Read on website | #html | #web | #graphics

FXYT 0.5.0

2025-02-11T00:00:00Z

FXYT 0.5.0 is a minor update of FXYT, a tiny, esoteric, stack-based, postfix, canvas colouring language with only 36 simple commands. This release fixes an annoying bug that has been affecting some mobile device users for a while. On some mobile web browsers, such as Chrome on Samsung Galaxy S8, the drawing canvas would appear to be larger than the viewport thus overflowing the visible screen on the mobile device. The user would then be required to manually zoom out in order to use this tool conveniently. This issue has been fixed in this release.

If you follow my CFRS[] project, you might have noticed yesterday that a very similar fix has gone into CFRS[] too. For more details about that, see the release page for CFRS[] 0.3.0.

Visit FXYT to play with FXYT and draw some interesting patterns!

CFRS[] 0.3.0

2025-02-10T00:00:00Z

CFRS[] 0.3.0 is a minor update of CFRS[], an extremely minimal drawing language consisting of only 6 simple commands. This update fixes an annoying bug that caused CFRS[] canvas to overflow the visible screen on some mobile web browsers. In particular, this issue was observed on Chrome running on Samsung Galaxy S8.

To read more about CFRS[], go to github.com/susam/cfrs. Also, visit cfrs.html to play with CFRS[] now and draw some nice patterns!

FXYT 0.4.0

2025-02-09T00:00:00Z

FXYT 0.4.0 is a minor update of FXYT, a tiny, esoteric, stack-based, postfix, canvas colouring language with only 36 simple commands. This release increases the maximum allowed code length from 256 bytes to 1024 bytes. This means there is now more room for writing more complex FXYT programs!

Further, the maximum code length for distributable demo links has been increased from 64 bytes to 256 bytes. This allows several more impressive demos to have their own distributable links. As a specific example of one such demo, take a look at this animated sine wave developed by Nick Craig-Wood, of Rclone fame!

Guess My RGB 0.3.0

2024-09-14T00:00:00Z

Guess My RGB, the little colour guessing game, just got a small update. This update adds a "Mode" link to the footer which can be used to toggle the game between normal mode and expert mode.

The expert mode was introduced as a hidden feature five months ago in the previous release. With the current release, the expert mode no longer remains a hidden feature. You can simply toggle between modes via the new footer link.

Ready to test your colour skills? Head over to myrgb.html and start playing today!

Guess My RGB 0.2.0

2024-04-15T00:00:00Z

Guess My RGB, the little colour guessing game, received a minor update today. This update adds a hidden feature that lets you play the game in expert mode. In this mode, the match percentage for your submitted guess is not shown on the screen.

Thanks to @steffahn for suggesting this feature on th Lobsters forum!

Visit myrgb.html#x now to play the game in the expert mode.

Alternatively, visit myrgb.html to play it in the normal mode like before.

CFRS[] 0.2.0

2024-04-06T00:00:00Z

CFRS[] 0.2.0 is a minor update of CFRS[], an extremely minimal drawing language consisting of only 6 simple commands. This update brings minor changes to the built-in help screen that can be invoked by typing ? in the input pane. For example, the help screen now has a direct links to built-in demos and community demos. Further, based on community feedback, the description of the ] command has been updated with clearer language that better clarifies that this command repeats a repeatable block once (i.e. executes the repeatable block again). See the changelog for more details.

To read more about CFRS[], go to github.com/susam/cfrs. Visit cfrs.html to play with CFRS[] now and draw some nice pictures and animation. If you end up developing any cool demos, do share them by creating a new post here.

Guess My RGB 0.1.0

2024-04-03T00:00:00Z

Guess My RGB 0.1.0 is the first stable release of this tiny colour guessing game. The game is available as a single HTML page that runs in a web browser. It presents a page with a randomly chosen background colour. The player then needs to guess the three RGB hexademical digits that make the given background colour. See github.com/susam/myrgb for more information about this game.

I wrote this game last Saturday afternoon and shared it on my website at myrgb.html later that night. I had no intention of sharing this with a wide audience yet because I had not had sufficient time testing it well. But somehow a Hacker News (HN) user named talonx discovered this game on Sunday morning and shared it on HN in this post: news.ycombinator.com/item?id=39882018.

Since I had not shared this game with anyone anywhere yet, I was quite surprised to wake up Sunday morning and find my game trending at the top of HN. I believe this is where maintaining a web feed on my website might have helped. Every new page that I publish on this website also appears as an entry in the web feed for this website. This feed can be found here: feed.xml. I have a couple of hundred subscribers to this feed. It is very likely that the HN user who shared this game on HN found it through this feed.

Ever since this game was shared on HN, my website has received a large number of hits. In the last three days (excluding today), this game has received a total of 166102 hits. The actual numbers for each day look like this:

Date	Hits
31 Mar 2024	95467
01 Mar 2024	48330
02 Mar 2024	22305

To all visitors of this website who played this game and shared this game with others, thank you! Crafting tiny software tools like this is a creative outlet for me. To know that there are others out there who enjoyed this game brings me joy!

To play this game, go to myrgb.html now and guess some colours!

Guess My RGB

2024-03-31T00:00:00Z

A tiny, web-based, RGB colour guessing game.

FXYT 0.3.0

2024-03-29T00:00:00Z

FXYT 0.3.0 is a minor release of FXYT, a tiny, esoteric, stack-based, postfix, canvas colouring language with only 36 simple commands. This release comes with minor bug fixes pertaining to initialising the input and output from code embedded in distributable links. No change in the language definition or the language implementation has been made in this release.

Visit fxyt.html to play with FXYT. See README for more details. Also, see this demo page for some nice demos developed by the tiny community around FXYT.

CFRS[] 0.1.0

2023-12-25T00:00:00Z

CFRS[] 0.1.0 is the first release of CFRS[], an extremely minimal drawing language that consists of only six simple commands. Ever since this new esoteric language and its implementation was announced about two months ago, a small but enthusiastic community has sprung up around it. Feedback and enhancement requests from the community has been crucial in polishing the implementation and arriving at the current stable release. Further, some community members have also submitted very interesting and impressive demos.

To play with CFRS[] now, please visit cfrs.html.

See github.com/susam/cfrs for more information about CFRS. Also, see this demo page for a curated collection of community demos.

FXYT 0.2.0

2023-12-24T00:00:00Z

FXYT 0.2.0 is a minor update of FXYT, a tiny, stack-oriented, canvas colouring language written in postfix notation with only 36 simple commands. This update specifies and implements a much stricter definition of the F command that sets the frame interval. The problem with the earlier definition as well as implementation was that the F command was evaluated for every cell in the canvas and the frame interval was set for every such interval. This meant that the frame interval that would be set for the next frame would depend on the order in which the evaluation occurred. See section Frame Interval of the README for the complete details.

This update now ensures that a coordinate-dependent frame interval set with the F command behaves uniformly across any implementation of FXYT regardless of the order of evaluation. This is done by ensuring that while the command F is evaluated for all cells, it is only the frame interval value found during the evaluation of cell (0, 0) that is honoured as the frame interval for the next frame.

The new update is now available at fxyt.html. You are very welcome to try it out and play with it. If you come up with any interesting demos, please do share them here.

FXYT 0.1.0

2023-12-20T00:00:00Z

FXYT 0.1.0 is the first release of this project that introduces the FXYT canvas colouring language and a reference implementation. This project is inspired by Martin Kleppe's very popular Tixy project. While Tixy supports JavaScript expressions to determine the size and colour of circles in a 16x16 grid, FXYT comes with its own tiny, stack-based language that is written in postfix notation. Further, FXYT provides a 256x256 grid of cells each of which can be painted with an arbitrary colour determined by the result of the evaluation of the input code.

To see some demos, visit these links: #1, #2, #3, #4 and #5.

Also, see github.com/susam/fxyt for more details about this project.

FXYT

2023-12-19T00:00:00Z

Tiny, stack-based, postfix, canvas colouring language with only 36 simple commands.

CFRS[]

2023-10-19T00:00:00Z

An extremely minimal drawing language consisting of only 6 simple commands: C, F, R, S, [ and ].

TextMetrics

2023-02-01T00:00:00Z

An example page that demonstrates text metrics measurements.

Read on website | #web | #graphics

Andromeda Invaders

2022-02-13T00:00:00Z

A 1980s-arcade-style game written using HTML5, Canvas and Web Audio.