2026-03-23T15:24:59Z https://yabu.me HEX Projects https://yabu.me/npub1usx026nu24mqex5mdesg6fhyu0h4fh5q8r3qlmxa8hwtpwp65ams279984 https://typo.social/system/accounts/avatars/109/320/909/169/861/872/original/12df783e5471478e.png https://typo.social/system/accounts/avatars/109/320/909/169/861/872/original/12df783e5471478e.png https://yabu.me/nevent1qqspm7zmsr64n2llxw7y3qjmrq4n0m5c8008qnekvzh4z56g8lx562czyrjqeat2032hvry6ndhxprfxun3774x7squwyrlvm57aev9c82nhw5yg9ds An interactive web experiment combining a springy-baseline hover effect with a variable font whose glyphs can flex to match the baseline’s curvature:<br/><a href="https://hex.xyz/Shop_Sans/boing/">https://hex.xyz/Shop_Sans/boing/</a><br/><br/>The CSS code is based on demos from <span itemprop="mentions" itemscope itemtype="https://schema.org/Person"><a itemprop="url" href="/npub19q8mse6f2amuz0f88trxh333clfe8x0whv553laqh2ekp76nyy4sy05kmj" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1"><span>CSS by T. Afif :verified:</span> (<span class="italic">npub19q8…5kmj</span>)</a></span> with tips from <span itemprop="mentions" itemscope itemtype="https://schema.org/Person"><a itemprop="url" href="/npub1p63kxvwm8rx05zhl038c8fltgqh5u6v2yj6n6cefpxpf4zspsyvqsvgl53" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1"><span>Roma Komarov</span> (<span class="italic">npub1p63…gl53</span>)</a></span> yesterday:<br/><a href="https://front-end.social/@css/116006138838064149">https://front-end.social/@css/116006138838064149</a><br/><br/>The variable font is Shop Sans, which I made for exactly these kinds of curved-baseline situations:<br/><a href="https://www.futurefonts.com/hex/shop-sans">https://www.futurefonts.com/hex/shop-sans</a><br/><br/>It’s just CSS with a variable web font (no JavaScript involved) and would have been impossible until fairly recently.<br/><video controls width="100%" class="max-h-[90vh] bg-neutral-300 dark:bg-zinc-700"><source src="https://typo.social/system/media_attachments/files/116/011/626/236/207/639/original/0829b40a0017eacb.mp4"></video><br/> 2026-02-04T10:22:43Z https://yabu.me/nevent1qqsrwvxrwqcvtypngaz752xc2fy6t0zzd8vnhlsues0p4juwcyxuuwszyrjqeat2032hvry6ndhxprfxun3774x7squwyrlvm57aev9c82nhwxfh5qs Issue #2 of HEX News just went out, featuring the new Shop Sans typeface for setting text on curves, previews of other fonts in progress, font uses, miscellaneous personal recommendations, and more.<br/><br/>You can read the web version here:<br/><a href="https://hex.xyz/news/2/">https://hex.xyz/news/2/</a><br/><br/>Subscribe to get infrequent new issues in your email inbox or RSS reader:<br/><a href="https://hex.xyz/news/">https://hex.xyz/news/</a><br/> <img src="https://typo.social/system/media_attachments/files/115/537/410/825/380/945/original/9d48d732c3d31238.png"> <br/> 2025-11-12T15:28:07Z https://yabu.me/nevent1qqsgru0k5k6flyk8xzyex0nsgund7r0hyqaq04xez9823dyjzc3t6uqzyrjqeat2032hvry6ndhxprfxun3774x7squwyrlvm57aev9c82nhw73llul HEX launched 7 years ago tonight, on Halloween 2018.<br/><br/>To celebrate, I’m releasing a preliminary version of an experimental typeface I started even before that …<br/><br/>Shop Sans is a typeface for setting text on circles and curved baselines. Its ‘Curve’ variable font allows for bending type smoothly along arched paths, with adjustable curvature.<br/><br/>The initial version 0.1 is now available from <span itemprop="mentions" itemscope itemtype="https://schema.org/Person"><a itemprop="url" href="/npub1t7kpw67ze270k7mh8uw8q3a38kqymm3nnm8ya8cd96ehqv6ahvrqlz3vwk" class="bg-lavender dark:prose:text-neutral-50 dark:text-neutral-50 dark:bg-garnet px-1"><span>Future Fonts</span> (<span class="italic">npub1t7k…3vwk</span>)</a></span>, with more updates and improvements coming soon:<br/><a href="https://www.futurefonts.com/hex/shop-sans">https://www.futurefonts.com/hex/shop-sans</a><br/> <img src="https://typo.social/system/media_attachments/files/115/471/563/097/840/241/original/b5efeeab93e00698.png"> <br/><video controls width="100%" class="max-h-[90vh] bg-neutral-300 dark:bg-zinc-700"><source src="https://typo.social/system/media_attachments/files/115/471/570/697/701/231/original/a5e5b79156e2e5c3.mp4"></video><br/> <img src="https://typo.social/system/media_attachments/files/115/471/600/638/902/272/original/8a38f1f38a735132.png"> <br/><video controls width="100%" class="max-h-[90vh] bg-neutral-300 dark:bg-zinc-700"><source src="https://typo.social/system/media_attachments/files/115/471/572/285/326/651/original/7e213669823173ad.mp4"></video><br/> 2025-11-01T00:35:22Z https://yabu.me/nevent1qqsfukt3e4rg8y3tmwxhqwvwwly8jdd3zqsl53fnun09mqtlzxa5cwgzyrjqeat2032hvry6ndhxprfxun3774x7squwyrlvm57aev9c82nhwvl3520 In reply to <a href='/nevent1qqspsckksqe54gmp9cexkhtkkddj2hhz20a86jcykg2ct83wax3t60ssvllpy'>nevent1q…llpy</a><br/>_________________________<br/><br/>That Dymo script font wheel was what inspired my Plastic Script typeface! <br/><a href="https://hex.xyz/Plastic_Script/">https://hex.xyz/Plastic_Script/</a><br/><br/>It was a fun challenge to make a connecting script typeface where every glyph occupies the same monospaced width.<br/> <img src="https://typo.social/system/media_attachments/files/115/035/582/692/838/542/original/e8f5d9fe01fd6f14.png"> <br/> 2025-08-16T00:25:31Z https://yabu.me/nevent1qqsz5w42p6xgfntj2qxee295ercag0hzaa3qz6qrhduw0jtma5esuvczyrjqeat2032hvry6ndhxprfxun3774x7squwyrlvm57aev9c82nhwd992sh For anyone using variable fonts in Affinity design apps:<br/>⚠️ BEWARE ⚠️<br/><br/>Affinity applies kerning values from a variable font’s default instance (usually a moderate “Regular” style) to *all* variants of that font, even if it includes design variants with drastically different kerning.<br/><br/>It’s easy to miss in variable fonts with relatively limited stylistic ranges (where kerning doesn’t change much throughout), but it’s quite problematic for variable fonts that cover more expansive ranges of variation.<br/> <img src="https://typo.social/system/media_attachments/files/113/605/874/105/661/561/original/912b40fc7c591e5c.png"> <br/> 2024-12-06T12:47:41Z