Nathan Knowler
@knowler.dev
Building web stuff and design systems. Focused on accessibility, progressive enhancement, and web components. At the intersection of CSS and the Shadow DOM.
he/him
Métis/settler
Treaty 1/wpg
https://knowler.dev
https://sunny.garden/@knowler
he/him
Métis/settler
Treaty 1/wpg
https://knowler.dev
https://sunny.garden/@knowler
Pinned
Nathan Knowler
@knowler.dev
· Jun 24
I was laid-off and am looking for a new role.
Working were design meets code is my jam. I am skilled at building accessible design system components, working with Web Components APIs, and creating scalable CSS architecture.
I work remotely from my home in Manitoba, Canada. 🇨🇦
Shares appreciated!
Working were design meets code is my jam. I am skilled at building accessible design system components, working with Web Components APIs, and creating scalable CSS architecture.
I work remotely from my home in Manitoba, Canada. 🇨🇦
Shares appreciated!
`%:r` in vim is so useful (also `%:h`)
I use it all the time to create a file with the same name as the current one, but with a different extension
```vim
# creates a vertical split with a css file with the same name as the current one
:vsp %:r.css
```
I use it all the time to create a file with the same name as the current one, but with a different extension
```vim
# creates a vertical split with a css file with the same name as the current one
:vsp %:r.css
```
November 14, 2025 at 7:57 PM
`%:r` in vim is so useful (also `%:h`)
I use it all the time to create a file with the same name as the current one, but with a different extension
```vim
# creates a vertical split with a css file with the same name as the current one
:vsp %:r.css
```
I use it all the time to create a file with the same name as the current one, but with a different extension
```vim
# creates a vertical split with a css file with the same name as the current one
:vsp %:r.css
```
I now frequently restart my computer because I use Universal Control pretty much all the time.
November 14, 2025 at 4:38 PM
I now frequently restart my computer because I use Universal Control pretty much all the time.
Making the web work with no-JavaScript is a noble goal, but it tends to lose credibility when folks neglect accessibility in their pursuit of it. So, now when people say no-JS or CSS-only, I'm immediately skeptical.
November 13, 2025 at 6:26 PM
Making the web work with no-JavaScript is a noble goal, but it tends to lose credibility when folks neglect accessibility in their pursuit of it. So, now when people say no-JS or CSS-only, I'm immediately skeptical.
I have like 3 or 4 blog post drafts/ideas that all just converged. send help.
November 13, 2025 at 5:03 AM
I have like 3 or 4 blog post drafts/ideas that all just converged. send help.
BREAKING: Apple introduces iPhone Madball
November 12, 2025 at 8:34 PM
BREAKING: Apple introduces iPhone Madball
me, looks at oven: okay, 3:25. should be done at 3:30.
*much time passes*
me: how is it still only 3:25—shit!
*much time passes*
me: how is it still only 3:25—shit!
November 11, 2025 at 1:13 AM
me, looks at oven: okay, 3:25. should be done at 3:30.
*much time passes*
me: how is it still only 3:25—shit!
*much time passes*
me: how is it still only 3:25—shit!
6 year old suggested we ride our bikes to the library instead of bussing. we are now winter cyclists.
November 9, 2025 at 12:16 AM
6 year old suggested we ride our bikes to the library instead of bussing. we are now winter cyclists.
Reposted by Nathan Knowler
guys someone made a "plan your stable of cargo bikes" app: bikes.louiseveillard.com?bikes=super-...
like that 'look how big pickup trucks have got' website, but all the vehicles are awesome
like that 'look how big pickup trucks have got' website, but all the vehicles are awesome
Cargo Bikes Size Comparator
Compare the real size of cargo bikes easily.
bikes.louiseveillard.com
November 7, 2025 at 8:29 PM
guys someone made a "plan your stable of cargo bikes" app: bikes.louiseveillard.com?bikes=super-...
like that 'look how big pickup trucks have got' website, but all the vehicles are awesome
like that 'look how big pickup trucks have got' website, but all the vehicles are awesome
knowing that I'll be going outside later is making me feel warmer inside than I really am
November 8, 2025 at 8:09 PM
knowing that I'll be going outside later is making me feel warmer inside than I really am
good coffee is the requirement for a good coffee shop. good pastries are just an added bonus.
November 8, 2025 at 6:10 PM
good coffee is the requirement for a good coffee shop. good pastries are just an added bonus.
ah yes, put the `mailto:` link behind a button so I can't copy the email address and instead open the default desktop mail application that I don't use.
November 7, 2025 at 5:06 PM
ah yes, put the `mailto:` link behind a button so I can't copy the email address and instead open the default desktop mail application that I don't use.
Reposted by Nathan Knowler
Searchable, collapsible sections with hidden=until-found. Nathan Knowler shows how to make collapsible content searchable using this new HTML attribute and the beforematch event. #html #a11y
knowler.dev/blog/searcha...
knowler.dev/blog/searcha...
November 7, 2025 at 8:53 AM
Searchable, collapsible sections with hidden=until-found. Nathan Knowler shows how to make collapsible content searchable using this new HTML attribute and the beforematch event. #html #a11y
knowler.dev/blog/searcha...
knowler.dev/blog/searcha...
me, looking at my thick socks this morning: "that'd probably be overkill"
me, walking with the -15ºC windchill: *regrets*
me, walking with the -15ºC windchill: *regrets*
November 7, 2025 at 3:08 PM
me, looking at my thick socks this morning: "that'd probably be overkill"
me, walking with the -15ºC windchill: *regrets*
me, walking with the -15ºC windchill: *regrets*
every year the yard waste collection ends then a week later the tree on the boulevard out from my house loses all of its leaves.
November 6, 2025 at 8:58 PM
every year the yard waste collection ends then a week later the tree on the boulevard out from my house loses all of its leaves.
looking like snow tonight
November 6, 2025 at 8:47 PM
looking like snow tonight
Reposted by Nathan Knowler
Inside you there are two woffs.
Ignore the first woff. You just need the woff2.
Ignore the first woff. You just need the woff2.
November 6, 2025 at 7:18 PM
Inside you there are two woffs.
Ignore the first woff. You just need the woff2.
Ignore the first woff. You just need the woff2.
trying to sell becoming full members of the local car co-op to my spouse since we don't have a vehicle anymore (stolen)
November 6, 2025 at 6:58 PM
trying to sell becoming full members of the local car co-op to my spouse since we don't have a vehicle anymore (stolen)
Universal Control connecting immediately is good omens
November 6, 2025 at 5:34 PM
Universal Control connecting immediately is good omens
sometimes I think about my decisions to buy so many band shirts, only to wear layers upon layers on top of them during the fall and winter.
November 5, 2025 at 8:14 PM
sometimes I think about my decisions to buy so many band shirts, only to wear layers upon layers on top of them during the fall and winter.
I wish I could make shortcuts for arbitrary settings in iOS control center.
I'd have a disable JS one so fast.
I'd have a disable JS one so fast.
November 5, 2025 at 4:49 PM
I wish I could make shortcuts for arbitrary settings in iOS control center.
I'd have a disable JS one so fast.
I'd have a disable JS one so fast.
cool, I can implement my `safe-rem()` sass function in CSS now:
```css
@function --safe-rem(--value <number>) returns <length> {
result: max(var(--value) * 1rem, var(--value) * var(--safe-rem-minimum));
}
```
```css
@function --safe-rem(--value <number>) returns <length> {
result: max(var(--value) * 1rem, var(--value) * var(--safe-rem-minimum));
}
```
November 4, 2025 at 6:42 AM
cool, I can implement my `safe-rem()` sass function in CSS now:
```css
@function --safe-rem(--value <number>) returns <length> {
result: max(var(--value) * 1rem, var(--value) * var(--safe-rem-minimum));
}
```
```css
@function --safe-rem(--value <number>) returns <length> {
result: max(var(--value) * 1rem, var(--value) * var(--safe-rem-minimum));
}
```
I just nested `if()` in css… someone revoke my license
November 4, 2025 at 5:28 AM
I just nested `if()` in css… someone revoke my license
miss vickie's cacio e pepe chips are a 10/10, no notes
November 3, 2025 at 9:03 PM
miss vickie's cacio e pepe chips are a 10/10, no notes
if you keep scaling, eventually you'll explode
November 3, 2025 at 9:00 PM
if you keep scaling, eventually you'll explode