#strokedtext — Public Fediverse posts

Which do you prefer? First or second?

(it's the exact same demo, text and font, only different filters, btw)

Boosts appreciated.

#SVG #filter #svgFilter #CSS #cssFilter #textEffects #textEffect #code #coding #web #webDev #webDevelopment #dev #strokedText #frontend #neon #neonText #neonGlow

Which do you prefer? First or second?

(it's the exact same demo, text and font, only different filters, btw)

Boosts appreciated.

#SVG #filter #svgFilter #CSS #cssFilter #textEffects #textEffect #code #coding #web #webDev #webDevelopment #dev #strokedText #frontend #neon #neonText #neonGlow

Which do you prefer? First or second?

(it's the exact same demo, text and font, only different filters, btw)

Boosts appreciated.

#SVG #filter #svgFilter #CSS #cssFilter #textEffects #textEffect #code #coding #web #webDev #webDevelopment #dev #strokedText #frontend #neon #neonText #neonGlow

Which do you prefer? First or second?

(it's the exact same demo, text and font, only different filters, btw)

Boosts appreciated.

#SVG #filter #svgFilter #CSS #cssFilter #textEffects #textEffect #code #coding #web #webDev #webDevelopment #dev #strokedText #frontend #neon #neonText #neonGlow

Which do you prefer? First or second?

(it's the exact same demo, text and font, only different filters, btw)

Boosts appreciated.

#SVG #filter #svgFilter #CSS #cssFilter #textEffects #textEffect #code #coding #web #webDev #webDevelopment #dev #strokedText #frontend #neon #neonText #neonGlow

And by the way, this is totally doable IF there's no inner stroke overlap.

(if you're a $5+ patron on Patreon, you may have already seen the live demo)

#textEffect #svg #filter #svgFilter #css #strokedText #code #coding #frontend #webDev #webDevelopment

#CSS #gotcha:

❌ `text-stroke` doesn't work on `:first line` ❌

Need to wrap stuff in spans... 😭

Live test https://codepen.io/thebabydino/pen/ExzxgPa

#code #coding #frontend #webDev #webDevelopment #strokedText

Most cursive #fonts are unusable with `text-stroke`. Yeah, there's `paint-order`, but I want to have a *semi-transparent* stroke *on top* of the fill in order to create a `font-size`-relative *double* stroke (think something like https://dribbble.com/shots/15885997-Vintage-Typography, where we have an inner white stroke and an outer blue one), so just covering up the stroke where it intersects the fill defeats that purpose.

#textStroke #stroke #strokedText #handwriting #font #typography #css #code #coding #frontend #webDev