Amongst other things, I am MUCH better at coding and making software having worked with David all this time.
Amongst other things, I am MUCH better at coding and making software having worked with David all this time.
hello. are you an incredibly good UI designer? want to work with people who will love and respect your work and your process? want to make $250k (same as every other employee) and work fully remote? take a look
The height of this container is responsive but I wanted to create a `#` border without any partial characters. Discovered I could use `round(up, 100%, 1lh)` to round up to the nearest multiple of the mono char line height.
I haven't, but that sounds useful! FWIW when I did the first batch of colours a while ago, I was trying to split the difference between them looking equivalent and having equivalent contrast using a Figma plugin. If you just do contrast I don't think you get something that looks right.
I know just enough to get me in trouble, I was trying to avoid creating custom curves for each colour.
Well both dark and light mode draw upon the same core colours now. I just extended to add brighter tints. As an example, this would be the red if I just did a straight hue shift from our accent green. It ends up looking super pale. And yeah exactly on lowering the ones with a wider range.
Exactly! Pretty low risk either way
I suspect for larger orgs, the JSON route would be better. We're a very small team on the product side, so making any automations or tooling more maintainable is a big plus.
We just use Tailwind, so the transformation to other formats isn't useful and LLMs can make large scale changes directly to the CSS easier. Also bidirectionality is less important to me now, especially since Figma lacks native OKLCH support.
Astigmatism comes for us all
I'm no colour expert, but I find if you stick to what is completely perceptually equivalent you end limited by the hues with the smallest range. So what I end up doing is overcranking it, letting it fallback within gamut and then compensating for other colours that seem oversaturated.
Yeah, Oklab is the best colour space I've used for this sort of thing so far. I still end up adjusting down some of the chroma on a couple colours. I think I'm likely relying on the colours snapping back into gamut, that way I avoid having one or two of them looking duller than the rest.
You get a little spill this way, but maybe that's what you're after.
```
font-size: 200px;
background-color: red;
color: transparent;
text-shadow: 0px 0px 14px rgb(255 232 232 / 60%);
background-clip: text;
```
Lots to organise and finalise but the draft PR (including palette generator and Figma plugin) found here: github.com/oxidecompute...
Migrating away from JSON design tokens and now just parsing directly from the CSS files has meant we could remove lots of token-based automation. Built a plugin (thanks @gavinmcfarland.bsky.social for plugma.dev) to sync it with the Figma variables, transforming from OKLCH
Since we were already using semantic tokens, by just adding `data-theme="light"` the light theme works 95% out of the box. With a few exceptions in places using `light:` variants in Tailwind.
Starting with a simple palette generator. I recreated the existing colour steps with OKLCH and extended down into brighter lightness. Both dark and light themes driven by the same base tokens. Using a hue shift at the darker end to have it blending well with the background.
Lots of fun working on a light mode theme for the @oxide.computer design system, backed by an generative OKLCH palette and Figma plugin for token syncing
Blocked!
Thank you!
Happy New ASCII Blog Header Day (for those who celebrate)
oxide.computer/blog/our-200...
I keep meaning to ask, what typeface is this? It's very soothing.
@saewitz.com Thank you! Oxide have been very generous in granting me creative license to potter about as I wish.
Would love to see that!
For those doing any sort of semi-automated colour or theme management โ any workflow recommendations? Fixed contrast ratios results in dull green/yellows, but something like HSLuv washes out the other colours. Any approach better than rough generation then manually nudging by eye from there?
cool job at a very special computer company
- write TypeScript and Rust
- everyone makes $235k
- fully remote
- everything is open source
Oh this is so good!
Been fun collaborating on a web 3d rack explorer UI for @oxide.computer with @krystianzun.com. It always feels a little magic to have shared state between the main UI and the canvas so the user can interact with either.
Placeholder content and rack model coming soon.
Looks lovely!
How upset are you that we didnโt go to the SF one