top | item 46395061

Drawing with zero-width characters

122 points| benswerd | 2 months ago |zw.swerdlow.dev

31 comments

order

krackers|2 months ago

Seems like a more advanced version of zalgotext (which also uses combining marks)

benswerd|2 months ago

This is beautiful and I did not know it existed until now tx

bawolff|2 months ago

I can't tell if the results are just very bad or my browser is just not rendering properly. I feel like its probably the later but it would be cool to have a reference picture to be sure.

esperent|2 months ago

Same here, Brave on Android. I see a load of wavy vertical lines with some striations that could pass for abstract art, but no obvious image.

benswerd|2 months ago

which browser are you using?

benswerd|2 months ago

Figured this out a couple weeks ago, hoping it can lead to some cool new art.

mkl|2 months ago

Images of what it's supposed to look like would really help, as I'm pretty sure none of my browsers are rendering it as you hoped. For me in Chrome the first image looks vaguely like a landscape, with no identifiable features, and in Firefox it looks like grass (both on Android). The dog and tree shapes look distorted and glitchy, but recognisable if you know what they're supposed to be.

I spotted a typo: "font's like".

5-0|2 months ago

Neat! Sparklines could also benefit.

weare138|2 months ago

Warning: This article is best viewed in a Chromium-based browser (Chrome, Edge, Vivaldi, etc.) for intended rendering of stacking marks.

Chromium is the new Internet Explorer.

chrisfrantz|2 months ago

Love that this exists now, thank you and nice read.

FWIW, didn't have any luck with the generator at the bottom, could be user error.

benswerd|2 months ago

What browser was it in?

senfiaj|2 months ago

When I visit such pages, my impression is that someone want to break my browser.

benswerd|2 months ago

thats the vibe i was going for

ilaksh|2 months ago

Another thing in the category of abusing font capabilities is Harfbuzz (OpenType engine) WASM, which if compiled into an application allows fonts to basically run any code. A few examples are an LLM or a Tetris font. Apparently this WASM support is in the font rendering for Chrome and Firefox supposedly.

I was really tempted to try to use it to make a Harfbuzz OS.

https://fuglede.github.io/llama.ttf/

achairapart|2 months ago

Testinۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗ ings۪۪۪۪۪۪۪۪۪۪۫۫۫۫۫۫۫۫۫۫...

araes|2 months ago

Also,

Tۜۜۜۜۜeۢۢۢۢۢsۛۛۛۛۛtۙۙۙۙۙiۚۚۚۚۚnۨۨۨۨۨg۫۫۫۫۫

T◌ۜ◌ۜ◌ۜ◌ۜ◌ۜe◌ۢ◌ۢ◌ۢ◌ۢ◌ۢs◌ۛ◌ۛ◌ۛ◌ۛ◌ۛt◌ۙ◌ۙ◌ۙ◌ۙ◌ۙi◌ۚ◌ۚ◌ۚ◌ۚ◌n◌ۨ◌ۨ◌ۨ◌ۨ◌g◌۫◌۫◌۫◌۫◌۫◌

|ۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗۗ|ۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘۘ|ۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙۙ|ۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚۚ|ۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛۛ|ۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜۜ|۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟۟|۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠۠|ۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡۡ|ۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢۢ|ۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧۧ|ۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨۨ|۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫۫|۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬۬|ۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤۤ.

Tۜۜۜۜۜeۢۢۢۢۢsۛۛۛۛۛtۙۙۙۙۙiۚۚۚۚۚnۨۨۨۨۨg۫۫۫۫۫

Author's specific examples: Aۜۢۛۜۢۛۜۢۛۜۢۛۜۢۛ Bۙۚۨ۫ۙۚۨ۫ۙۚۨ۫ۙۚۨ۫ Cۣۣۣۣۣۣۣۭۭۭۭۭۭۭ Dۣۭۣۭۣۭۣۭۣۭۜۢۜۢۜۢۜۢۜۢ

Further Tॅॅॅॅॅeॆॆॆॆॆsेेेेेtैैैैैiॉॉॉॉॉnँँँँँgॄॄॄॄॄ with oೄೄೄೄೄtೋೋೋೋೋhೌೌೌೌೌe్్్్్rඃඃඃඃඃ lិីឹឺុូួើឿៀេែៃោៅំះៈ៉៊់៌៍៎៏័៑្៓aᢅᢅᢅᢅᢅᢆᢆᢆᢆᢆn଼ାିୀୁୂୃେୈୋୌ୍ୖୗg֒ ֓ ֔ ֕ ֖ ֗ ֘ ֙ ֚ ֛ ֜ ֝ ֞ ֟ ֠ ֡ ֣ ֤ ֥ ֦ ֧ ֨ ֩ ֪ ֫ ֬ ֭ ֮ ֯ ְ ֱ ֲ ֳ ִ ֵ ֶ ַ ָ ֹ ֻ ּ ֽuﬞ ﬞ ﬞ ﬞages .

Now attempts with superscript A Bⷠⷡⷢⷣⷤⷥⷦⷧⷨⷩⷪⷫⷬⷭⷮⷯⷰⷱⷲⷳⷴⷵⷶⷷⷸⷹⷺⷻⷼⷽⷾⷿꙴꙵꙶꙷꙸꙹꙺꙻꚞꚟ Cꙷꙷꙷꙷꙷꙷꙷ Dⷶⷠⷡⷢⷣⷷⷤⷥⷦⷧⷨⷩⷪⷫⷬⷭⷮⷯⷰⷱⷲⷳⷻ E F G H (Some kind of work, U+32x thru U+34x were E-G, U+20Dx was H, work on websites, just won't copy/paste to forum)

Edit: Apparently, you cannot write direct html entities.

Edit: And you cannot directly write the characters either. Rendering seems rather finicky on Firefox, while Chrome seems somewhat consistent.

Actually, on Chrome, copying the characters directly "kind of" worked. They're still shown next to each other, yet some of them combined and actually created towers.

Writing the HTML entities on a private webpage and then copying them over seemed to work the best.

Edit: Apparently, at least some of the Devanagari unicode behaves similarly.

Edit: Several other languages combining marks taken from https://www.cogsci.ed.ac.uk/~richard/unicode-sample-3-2.html and https://www.compart.com/en/unicode/category/Mn seem to also work.

After further testing, Both browsers are really finicky, and have wildly different interpretations of pasting combining characters directly, vs writing HTML entities, vs copying the combined stack from an existing site.

NooneAtAll3|2 months ago

firefox refuses to render these and maxes out my CPU fans xD