Link | Description | Added by |
---|---|---|
https://medium.com/refactoring-ui/7-practical-tips-for-cheating-at-design-40c736799886 | Article on UI design with css | jamesj-0 |
https://yoksel.github.io/flex-cheatsheet/ | Flexbox cheatsheet | hannahgooding |
https://codepen.io/oliverjam/full/YzXYRzw | Flex grow/shrink/basis interactive explanation | oliverjam |
https://blog.logrocket.com/how-to-create-better-themes-with-css-variables-5a3744105c74/ | How to create better themes with CSS variables | lizzy-j |
https://css-tricks.com/responsive-grid-magazine-layout-in-just-20-lines-of-css/ | Responsive Grid Magazine Layout in Just 20 Lines of CSS | glrta |
https://cssgridgarden.com | Grid garden - a game for learning CSS grid | glrta |
https://flukeout.github.io/ | CSS Diner - a game that teaches you advanced CSS selectors | hannahgooding |
https://9elements.com/bem-cheat-sheet/ | BEM cheatsheet | Kat |
CSS cheatsheet from Udemy course | CSS processing, relative units and inheritance cheatsheet | Jack |
A nerd's guide to colour | CSS tricks article with everything about colour theory for web development | Jack |
https://css-tricks.com/lodge/svg/ | Intro to SVGs - series of ~5min videos | Ivo |
https://css-tricks.com/icon-fonts-vs-svg/ | Icon fonts v.s. SVGs | Ivo |
CSS Easing functions | Snippets for different easing functions - e.g. bounce in, accelerate out, etc | Jack |
Bezier curve generator | Design and test your own bezier curves | Jack |
CSS for People Who Hate CSS | Some simple but important guidance on getting CSS right | Jack |
30 helpful selectors | explanation of 30 selectors than can be particularly helpful to understand | Jack |
Oli's CSS feedback | Oli's helpful comments on my failing CSS | Jack |