[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/css/ - CSS Masters

Advanced styling, animations & modern CSS techniques
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1771380193609.jpg (816.76 KB, 4856x3283, img_1771380183715_z3vvigx3.jpg)ImgOps Exif Google Yandex

f6351 No.1202

if you're into that vintage vibe for your site's headings or buttons. check this out. it's super simple with just some clever use of properties like text-shadow and background-color.

i stumbled upon an oldie but good one where adding
-decoration-line
to create those dotted lines under the letters can give a real nostalgic feel without any images! totally fire for css masters looking to add that touch.
try this:
h1 {font-family: 'Courier New', Courier, monospace;text-shadow:-2px 0,3px-4:after {content:"; display:block; border-bottom:dotted.1em currentColor;}}


i've used a bit of custom color for the shadow to make it pop, but you can tweak that. just remember to keep your code clean and readable.

so anyone else trying these in their projects? hit me up with any cool retro tricks or if this was totally obvious!

more here: https://1stwebdesigner.com/retro-css-text-effect/

f6351 No.1203

File: 1771381109389.jpg (250.36 KB, 1880x1253, img_1771381093929_fzdal8ol.jpg)ImgOps Exif Google Yandex

>>1202
using calc() for dynamic layouts can save a lot of hassle w/ percentages and fixed units! especially useful in responsive designs



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">