Collective #563
Inspirational Website of the Week: Born & Bred
Engaging motion makes browsing this website a delightful dynamic experience. Our pick this week.
Get inspiredOverflow: User flows done right.
Boost design presentation to peers or clients with Overflow, the world's first user flow diagramming tool for design and product teams!
Start 30-day free trialThings We Can’t (Yet) Do In CSS — Smashing Magazine
In this article, Rachel Andrew looks at some common layout patterns that we can’t yet do on the web and the CSS Specifications that might let us achieve them in the future.
Read itReact Query
Hooks for fetching, caching and updating asynchronous data in React.
Check it outOK
Super-cool CSS type animation by Adam Kuhn.
Check it outInspect This Snake
Play the snake game in the web inspector in this cool experiment by Matthew Rayfield.
Check it outGame Off 2019
Game Off is an annual game jam, where participants spend the month of November creating games based on a specific theme.
Check it outPure CSS Lace
Diana Smith's latest CSS art: a stunning pure CSS oil painting.
Check it outSpleeter
Spleeter is the source separation library by Deezer. With pre-trained models written in Python and using Tensorflow it allows you to extract vocals, drums, bass and piano from a music track.
Check it outFloat Element in the Middle of a Paragraph
Chris Coyier shares a useful trick on how to float an element in the middle of a paragraph.
Read itThe Svelte Handbook
In case you missed it: Flavio Copes wrote this free ebook for everyone who wants to learn Svelte.
Read itGraphQL Crash Course
A visual guide to GraphQL by Xiaoru Li.
Read itCSS variables in transforms
Lucas Hugdahl's great tip on using CSS variables in transforms to avoid rewriting the whole rule for a transition.
Check it outGetting your sites ready for the new Microsoft Edge
Read all about the new Microsoft Edge that is built on the Chromium engine.
Read itVisual Studio Online
The web-based version of the famous IDE is now in public beta.
Check it outSidebearings
A collection of typography and lettering resources designed to focus on beginners as well as advanced type designers, graphic designers and enthusiasts.
Check it outCSS Variables With Inline Styles
Ahmad Shadeed explores some use cases of inline CSS custom properties.
Read itRecursive Sans & Mono
A highly-flexible variable font for design, code, and UI coming soon to Google Fonts.
Check it outUpscale animation to 4k in real-time
Learn about a very cool algorithm called anime4k that can upscale animations to 4k in real-time without deep learning and see how it's implemented in WebGL.
Read itPure CSS Cauldron
Hover to remove the shading in this great demo by Jhey Tompkins.
Check it outFree templates for freelancers
Browse through the largest collection of free templates for freelancers, carefully curated by the FYI team.
Check it outCreative WebGL Image Transitions
A set of interesting looking image transitions including distortion and warp effects made with WebGL.
Check it out