Real CSS Tweets (Vol. I)

Go to Source

We be tweetin’ all the time about web design and development stuff. In fact, @Real_CSS_Tricks, the official Twitter account for this site, is largely just an outgoing airhorn for the stuff we publish here and interesting things elsewhere. The human beings that operate this site have their own accounts.

It’s pretty interesting to see which tweets take off! Here’s a list of the most popular tweets in the last year or so.

Wanna see a decent little slider in a handful of lines of code? pic.twitter.com/zOsN4mhRFw

— CSS-Tricks (@Real_CSS_Tricks) October 23, 2016

That one turned into a blog post and demo.


Loads of icons you can make with a single element (and pseudos)https://t.co/s3VyHj2P11 pic.twitter.com/mlIkyjc86w

— CSS-Tricks (@Real_CSS_Tricks) October 16, 2016

I’d say SVG is normally the best fit for this kind of thing, but this is a damn impressive experiment. I like the websites interface in how you can hover over the parts of CSS and it shows you what part of the icon it is.


Some more helpful mini tools:

CSS Peeper: https://t.co/RRbKhut7Ea

Chrome extension that displays styling information about the current site. pic.twitter.com/bs3NtmgI3I

— CSS-Tricks (@Real_CSS_Tricks) December 23, 2016

Always helpful to have a quickie site to snag nice colors.https://t.co/h2Ei8syLEU pic.twitter.com/X0GGXyn5dE

— CSS-Tricks (@Real_CSS_Tricks) April 4, 2016

Reminder that Clippy is an *awesomely helpful* little app for clip-pathhttps://t.co/SZILcdftSZ pic.twitter.com/qcKvcaTO8a

— CSS-Tricks (@Real_CSS_Tricks) April 6, 2016


Demos!

ooOOo fancy. "Aquarelle is a watercolor js effect."https://t.co/0ycH8fcyRV pic.twitter.com/NKqj0LKZf0

— CSS-Tricks (@Real_CSS_Tricks) January 16, 2017

What a cool way to show nav with what is current visible: https://t.co/u7yHR2QtlP pic.twitter.com/m53rzHD8El

— CSS-Tricks (@Real_CSS_Tricks) January 13, 2017

The Twitter heart explosion animation by @anatudor with:

1 Element
0 Images
0 JavaScripthttps://t.co/9rcDYZwjrY pic.twitter.com/tA7zaMg3xl

— CSS-Tricks (@Real_CSS_Tricks) June 29, 2016


Little bits of code:

Always so satisfying centering stuff with flexbox. pic.twitter.com/uH8u9EQhaw

— CSS-Tricks (@Real_CSS_Tricks) January 11, 2016

Native (!) smooth scrolling:

window.scroll({
top: 2500,
left: 0,
behavior: 'smooth'
});

Polyfill: https://t.co/I6fHdLzDTT

— CSS-Tricks (@Real_CSS_Tricks) November 2, 2016

This was confusing me, but I think we have it sorted now.https://t.co/uRuiJTA68yhttps://t.co/cvYQA1riU4 pic.twitter.com/lQhba7QEpe

— CSS-Tricks (@Real_CSS_Tricks) January 22, 2016


Stuff right here on CSS-Tricks:

Input Masking :: https://t.co/ee1bRnPPnl pic.twitter.com/xVZUIc8XTr

— CSS-Tricks (@Real_CSS_Tricks) November 30, 2016

Sticky Footer
❶ ❷ ❸ ❹ ❺
Ways!https://t.co/4shCFk12UY pic.twitter.com/VjFmQnK65H

— CSS-Tricks (@Real_CSS_Tricks) May 25, 2016

So. Much. Info. on CSS Grid Layout.https://t.co/lTmSHGztho pic.twitter.com/D0lBxQSQxG

— CSS-Tricks (@Real_CSS_Tricks) March 29, 2016

❤️


Real CSS Tweets (Vol. I) is a post from CSS-Tricks

Go to Source