Mark Tomlinson's Avatar

Mark Tomlinson

@marktomlinson.dev.bsky.social

Web dev. Building tools for better design-development workflows. Currently building @sugarcube.sh There is another world, but it's in this one. 🌐 marktomlinson.dev πŸƒ loanwords.leaflet.pub

369 Followers  |  911 Following  |  264 Posts  |  Joined: 17.09.2023  |  2.1566

Latest posts by marktomlinson.dev on Bluesky

Awesome that you're going the atproto route with this! I've done a bunch of work on a lexicon for a read cv alternative so if you want to compare notes or collaborate on that aspect, I'd be very interested in that.

31.01.2026 01:00 β€” πŸ‘ 2    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0
Book cover of the Penguin Classics title, The Metaphysical Poets.

Book cover of the Penguin Classics title, The Metaphysical Poets.

30.01.2026 04:46 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

I feel at once seen, insulted, and hungry.

29.01.2026 22:58 β€” πŸ‘ 3    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

Love that. Looks like a really neat set up.

29.01.2026 21:43 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0
Preview
Clack v1.0 is here! We're thrilled to announce Clack v1.0: a stylish prompt library for JavaScript CLIs.

Exciting newsβ€”Clack v1.0 is here! πŸŽ‰

🫳 Dropped CJS distribution (the only breaking change)
πŸ†• Added autocomplete, taskLog, and more
🌏 Localization support
🐞 Dozens of bug fixes + performance improvements
πŸ€— Ecosystem alignment

This release marks stable support for our current APIs

28.01.2026 15:25 β€” πŸ‘ 81    πŸ” 12    πŸ’¬ 2    πŸ“Œ 9

Oh and the key can be a CSS custom property as well.

So you can generate:

.flow-space-sm {
--flow-space: var(--space-sm);
}

etc.

28.01.2026 23:18 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

Nested tokens like color.text.muted with prefix: "text" would give you .text-text-muted (awkward).

Enable stripDuplicates: true and it becomes .text-muted.

Oh btw, 'prefix' is optional. If omitted, it defaults to the first segment of source.

28.01.2026 23:18 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 2    πŸ“Œ 0

The config key is the CSS property.

The token path after the * becomes the class suffix.

So if the token path = color.primary...

And the config = "background-color": { source: "color.*", prefix: "bg" }...

You'd get:

.bg-primary {
background-color: var(--color-primary)
}

28.01.2026 23:18 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

The guy is terrible, completely unreliable. But I’ll get him to send you a quick vid that should help with that.

28.01.2026 10:18 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

Do not tease us like that

28.01.2026 09:43 β€” πŸ‘ 2    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

Yep sounds like a pretty natural fit for that sort of workflow. Would be happy to help you try it out in a project or test project. DMs always open

28.01.2026 09:41 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

That's the beauty, isn't it? Engramma has been great to help me visualise sugarcube's starter kit tokens as I tweak them.

People could develop their tokens in Engramma, export them straight into sugarcube for some runtime action etc.

28.01.2026 09:02 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

The suggestions you're seeing in my IDE are just zed magic. Would love to build a sugarcube LSP one day

28.01.2026 08:55 β€” πŸ‘ 2    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0
Preview
Design Tokens Community Group The DTCG’s goal is to provide standards upon which products and design tools can rely for sharing stylistic pieces of a design system at scale.

Design tokens follow the current stable version of the DTCG spec - so interoperable with other DTCG-spec tools!

Sugarcube works by detecting tokens. If you don't have any in your project already, we install a full starter kit for you.

28.01.2026 08:55 β€” πŸ‘ 2    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0
Screenshot of a vite plugins config that shows the sugarcube vite plugin accepting a unocss preset (in this case, the presetWind3 plugin with preflights disabled).

Screenshot of a vite plugins config that shows the sugarcube vite plugin accepting a unocss preset (in this case, the presetWind3 plugin with preflights disabled).

Dang, almost forgot my favourite part: it supports unocss presets so you're not limited to token-based utilities! I mean, I personally urge restraint when it comes to utility classes, but unocss presets are super restrainable.

Massive thanks to @unocss.dev. Please support them!

28.01.2026 08:32 β€” πŸ‘ 3    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

P.S. Open beta launch is imminent but if you would like to help test before then, would love to chat!

28.01.2026 08:15 β€” πŸ‘ 5    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0
Video thumbnail

Here's a dumb video of me coding. No, that's not tailwind. Those are utilities generated straight from your @designtokens.org design tokens. Again, only the ones you actually use will be included in your build.

28.01.2026 08:15 β€” πŸ‘ 8    πŸ” 1    πŸ’¬ 3    πŸ“Œ 0
Screenshot of part of an example sugarcube config file, including part of an example utilities config.

Screenshot of part of an example sugarcube config file, including part of an example utilities config.

I might be wrong but I have a feeling sugarcube is the first token translation tool that generates utilities just-in-time (i.e. only the classes you end up using in your markup).

It also has a pretty nice config interface, though I would say that πŸ˜…

28.01.2026 08:15 β€” πŸ‘ 4    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

One of the hardest features of @sugarcube.sh to try to get right has been utility class generation. Someone pushed me early on to make it a priority and I'm glad they did as it's one of my favourite parts of the tool.

28.01.2026 08:15 β€” πŸ‘ 5    πŸ” 1    πŸ’¬ 1    πŸ“Œ 0
Preview
Device allegedly thrown into Invasion Day crowd designed to 'explode on impact', say police A 31-year-old man is charged with making explosives in suspicious circumstances after a device was allegedly thrown into a crowd of hundreds of people attending an Invasion Day rally in central Perth ...

White racist literally threw a bomb at black people to kill them, apparently not a sufficient cause to have a moral panic, special envoy, national introspection, royal commission, terrorism declaration, new laws, 1,000 op-eds in The Australian. We're struggling to identify why that might be.

28.01.2026 04:57 β€” πŸ‘ 515    πŸ” 232    πŸ’¬ 26    πŸ“Œ 12

Everything is cooked and yet there is so little to eat.

27.01.2026 08:11 β€” πŸ‘ 3    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

Really lovely, John.

26.01.2026 04:23 β€” πŸ‘ 0    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

I mean, when has live coding ever not worked? Thanks for sharing this, Stu. Lots of goodness in those slides and definitely a lot of overlap with what I'm trying to do all these years later. Would love to pick your brain at some point!

22.01.2026 08:18 β€” πŸ‘ 0    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

Both of those look really interesting. Totally fascinated to see how it all evolves.

22.01.2026 05:38 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0
Video thumbnail

Designing directly in the browser with design tokens is proving quite a fun workflow (even if my design skills remain...fledgling).

22.01.2026 01:04 β€” πŸ‘ 20    πŸ” 0    πŸ’¬ 3    πŸ“Œ 0

Beautiful.

22.01.2026 00:40 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0

Jumped on here and saw references to 'W'.

Immediately slipped into a fantasy that Georges Perec was trending.

21.01.2026 23:59 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

Your recounting of that memory reminds me of a memory I have of a Swedish friend who was surprised to learn that the name of the animal was wallaby, not wannabe. β€œI thought they were called wannabes because they’re like wannabe kangaroos”, he argued.

21.01.2026 12:20 β€” πŸ‘ 1    πŸ” 0    πŸ’¬ 1    πŸ“Œ 0
Preview
Hiring a Design Engineer for Kesko Design System Hi πŸ‘‹πŸ», I’m Arielle, a Design Systems Architect working with Kesko. I’m currently helping to strengthen the existing design systems team in the organization and we’re looking for an experienced Design ...

Would you like to work with me? πŸ‘‹πŸ» I’m currently helping to strengthen the existing design systems team at Kesko and we’re looking for a nice & talented designer/developer to join us.

arielsalminen.com/2026/hiring-...

20.01.2026 12:24 β€” πŸ‘ 54    πŸ” 36    πŸ’¬ 6    πŸ“Œ 3

I hear ya

19.01.2026 09:27 β€” πŸ‘ 2    πŸ” 0    πŸ’¬ 0    πŸ“Œ 0

@marktomlinson.dev is following 20 prominent accounts