aarbrk, to Fonts Spanish
@aarbrk@mstdn.mx avatar

For A Project™, I need to learn about the historical origins of . Highly doubt these were first created on computers; where in the world have rectangular or carried a textual message? (The tiled signs in the subway are , not based on a grid.) Where did bitmap fonts really start?

Image credit: https://myfontlib.com/font/gorgeous-pixel-font

objetdiscret, to pixelart
@objetdiscret@pocketpixels.club avatar
tunera, to Typeface
@tunera@mastodon.design avatar
schizanon, to internet_funeral
@schizanon@mastodon.social avatar
  1. is a shaping engine, it's used in , , , , , +, , , , , , , , , , , Engine, and other places.

  2. Harfbuzz 8.0 introduces a shaper, that allows to be embedded in a file. https://www.phoronix.com/news/HarfBuzz-8.0

  3. It's only a matter of time until someone embeds a in a font file.

vintprox,
@vintprox@techhub.social avatar

@schizanon WhaaT!!!!!!! #WebAssembly in fonts?! WWHHYYYY???????????????? :0530: :AngeryCat: :BlobhajSadReach: :akko_aaa: :blob_fearful: :blobfoxfloofexplode: :blobfoxfloofexplode: :blobfoxfloofexplode: :blobfoxfloofexplode: :blobfoxfloofexplode: :blobfoxfloofexplode:

davidbisset, to Typeface
@davidbisset@phpc.social avatar

Teranoptia is a free #typeface without letters but instead of creatures, #dragons, etc.

You can use it to "create border ornaments, to daydream about monsters or just to spice your layouts with marginalia".

https://www.tunera.xyz/fonts/teranoptia/

#font

portcitystudios, to LosAngeles
@portcitystudios@masto.ai avatar

The Taft Building, at Hollywood and Vine, Hollywood, 1993. #losangeles #hollywood #photography #font #BlackAndWhite

thomas, to linux
@thomas@metalhead.club avatar

Okay, which font am I missing now? :thaenkin:

nekohayo,
@nekohayo@mastodon.social avatar

@thomas GNOME's official font currently is "Cantarell".

supernova,
@supernova@metalhead.club avatar

@thomas Next year, Linux will take over the desktop. I am certain!
Being sarcastic is destructive, but fun. Sorry. Ignore me for now. :-)

... looks a bit as if your font was a jack-ass trying to form ligatures where there are none. Or maybe it messes up the kerning in a very freaky way? I would not be surprised if this is some kind of an asian font that tries to render western language? Maybe even a right-to-left font in left-to-right mode? I have seen things, you know...

nhoizey, to CSS French
@nhoizey@mamot.fr avatar

🔗 “Hardest Problem in Computer Science: Centering Things”

#CSS #font

⚓️ https://nicolas-hoizey.com/links/2024/04/17/hardest-problem-in-computer-science-centering-things/

mortendk,

@nhoizey i have a class called .center-center { }
cause apparently my brain refuses to remember anything

nhoizey,
@nhoizey@mamot.fr avatar

@mortendk 🤣

Luke, to Typography
@Luke@typo.social avatar
dwnfonts, to pixelart zh-CN

#advertisement #PixelArt #PixelFont #BitmapFont #font

在数字化的世界里,字体不仅是信息的载体,更是情感与创意的传达者。今天,我们荣幸地向您介绍一款全新的像素字体——“小雅像素”。

小雅像素,源于经典的“MaruMinya”字体,经过精心改造,既保留了其大字形的特点,又增添了更多的留白之美,让每一个字都仿佛在呼吸,充满了生命力。整齐排列的像素布局,不仅保证了字体的清晰度,更实现了良好的可读性,让您在阅读的同时,也能感受到像素艺术的独特魅力。

“可爱”与“认真”,这两个看似矛盾的词汇,在小雅像素中得到了完美的融合。它既有着圆润可爱的线条,又不失严谨认真的气质,无论是用于设计、广告还是日常阅读,都能展现出独特的魅力。

somepx, to gamedev
@somepx@mastodon.gamedev.place avatar
popey,
@popey@mastodon.social avatar

@somepx That's delightful! Reminds me a bit of Spangles.

nhoizey, to CSS French
@nhoizey@mamot.fr avatar

🔗 “Hardest Problem in Computer Science: Centering Things”

#CSS #font

⚓️ https://nicolas-hoizey.com/links/2024/04/17/hardest-problem-in-computer-science-centering-things/

karlcow,
@karlcow@mastodon.cloud avatar

@nhoizey @emmanuelc cependant il manque quelque-chose…

place-content: center

https://developer.mozilla.org/en-US/docs/Web/CSS/place-content

nhoizey,
@nhoizey@mamot.fr avatar

@karlcow effectivement, mais ça ne résout pas tous les problèmes listés.

@emmanuelc

Edent, to CSS
@Edent@mastodon.social avatar

🆕 blog! “Use CSS to boost the font size of emoji with no extra markup”

I want to make emoji bigger than the text that surrounds them. At my age and eyesight, it can be difficult to tell the difference between 😃, 😄, and 😊 when they are as small as the text. Is there a way to use CSS to increase the font size of specific characters without having […]

👀 Read more: https://shkspr.mobi/blog/2024/04/use-css-to-boost-the-font-size-of-emoji-with-no-extra-markup/

#css #emoji #font #HTML

svgeesus,
@svgeesus@mastodon.scot avatar
Edent,
@Edent@mastodon.social avatar

@svgeesus
Cheers mate! Hope something comes of it. Let me know if there's anything else I can contribute.

blog, (edited ) to CSS
@blog@shkspr.mobi avatar

Use CSS to boost the font size of emoji with no extra markup
https://shkspr.mobi/blog/2024/04/use-css-to-boost-the-font-size-of-emoji-with-no-extra-markup/

I want to make emoji bigger than the text that surrounds them. At my age and eyesight, it can be difficult to tell the difference between 😃, 😄, and 😊 when they are as small as the text.

Is there a way to use CSS to increase the font size of specific characters without having to wrap them in an extra <span> or similar?

Yes! Although it is a bit of a hack.

This relies on 3 CSS features: src: local(), unicode-range,and size-adjust. Let me walk you through it.

@font-face {    font-family: "emoji";    src: local('Apple Color Emoji'),         local('Android Emoji'),         local('Segoe UI Emoji'),         local('Noto Color Emoji'),         local(EmojiSymbols),         local(Symbola);    unicode-range: U+231A-231B, U+23E9-23EC, U+23F0, U+23F3, U+25FD-25FE, U+2614-2615, U+2648-2653, U+267F, U+2693, U+26A1, U+26AA-26AB, U+26BD-26BE, U+26C4-26C5, U+26CE, U+26D4, U+26EA, U+26F2-26F3, U+26F5, U+26FA, U+26FD, U+2705, U+270A-270B, U+2728, U+274C, U+274E, U+2753-2755, U+2757, U+2795-2797, U+27B0, U+27BF, U+2B1B-2B1C, U+2B50, U+2B55, U+FE0F, U+1F004, U+1F0CF, U+1F18E, U+1F191-1F19A, U+1F1E6-1F1FF, U+1F201, U+1F21A, U+1F22F, U+1F232-1F236, U+1F238-1F23A, U+1F250-1F251, U+1F300-1F320, U+1F32D-1F335, U+1F337-1F393, U+1F3A0-1F3CA, U+1F3CF-1F3D3, U+1F3E0-1F3F0, U+1F3F4, U+1F3F8-1F43E, U+1F440, U+1F442-1F4FC, U+1F4FF-1F53D, U+1F54B-1F567, U+1F57A, U+1F595-1F596, U+1F5A4, U+1F5FB-1F64F, U+1F680-1F6CC, U+1F6D0-1F6D2, U+1F6D5-1F6D7, U+1F6DC-1F6DF, U+1F6EB-1F6EC, U+1F6F4-1F6FC, U+1F7E0-1F7EB, U+1F7F0, U+1F90C-1F93A, U+1F93C-1F945, U+1F947-1FA7C, U+1FA80-1FAC5, U+1FACE-1FADB, U+1FAE0-1FAE8, U+1FAF0-1FAF8;    size-adjust: 300%;}body {    font-family: "emoji", sans-serif;}

Here's how it works.

@font-face this tells the browser that we're defining a new font which will be referenced later.

font-family this is the name we're going to be using as a reference.

src: local('Apple Color Emoji') ... CSS can reference local fonts. We don't know what device this page is being viewed on, so we've included a number of popular fallback fonts which should work with all major browsers. You can also reference a webfont if you want - although Emoji fonts tend to have a large filesize. I've adapted this from Marc Fornós' CSS and added a few more common default emoji fonts.

https://developer.mozilla.org/en-US/docs/Web/CSS/%40font-face/unicode-range this tells the browser to use this font only for the specific codepoints mentioned. This is where the magic happens.

Emoji codepoints are complicated - especially when it comes to combining characters. You can see a full list of every sequence in Unicode 15.1. There are currently 3,782 different emoji.

There was some talk of using named ranges but that doesn't seem to have gone anywhere. So, instead, I've extracted all the Emoji codepoints and manually grouped them. It's a pretty long sequence, and I'm sure I've made a few mistakes.

https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/size-adjust this is used to increase or decrease the apparent size of a font.

Finally, the body { font-family: "emoji", sans-serif; } tells the browser to use the Emoji font (remember, this will only work on the specified Unicode range) and then fall back to the defaults sans-serif font. Obviously, you can specify whatever fonts you like.

Have a play with it

This is a nifty little hack if you want to make Emoji (or any other text) bigger than its surroundings.

I am indebted to Šime Vidas who demonstrated this trick to me.

https://shkspr.mobi/blog/2024/04/use-css-to-boost-the-font-size-of-emoji-with-no-extra-markup/

somepx, to gamedev
@somepx@mastodon.gamedev.place avatar

WINDS is now available on Itch, don't miss the launch sale~🍃

https://itch.io/s/121926/winds-launch-sale

#assets #gamedev #font

  • All
  • Subscribed
  • Moderated
  • Favorites
  • anitta
  • InstantRegret
  • mdbf
  • ngwrru68w68
  • magazineikmin
  • thenastyranch
  • rosin
  • khanakhh
  • osvaldo12
  • Youngstown
  • slotface
  • Durango
  • kavyap
  • DreamBathrooms
  • JUstTest
  • tacticalgear
  • ethstaker
  • modclub
  • cisconetworking
  • tester
  • GTA5RPClips
  • cubers
  • everett
  • megavids
  • provamag3
  • normalnudes
  • Leos
  • lostlight
  • All magazines