Automate the Boring Stuff with Python

Code
12 Days of Web
A year-end celebration of fundamental web technologies: HTML, CSS, and JavaScript.
GitHub - madrilene/eleventy-excellent: Opiniated Eleventy starter based on the workflow suggested by Andy Bell's buildexcellentwebsit.es.
Opiniated Eleventy starter based on the workflow suggested by Andy Bell's buildexcellentwebsit.es. - GitHub - madrilene/eleventy-excellent: Opiniated Eleventy starter based on the workflow ...
Fontsource
Self-host fonts in neatly bundled NPM packages.
Modern fluid typography editor
Generate fluid typography code snippets using modern CSS clamp function and fine-tune fluid typography behavior using this robust and sleek editor.
Conditionally adaptive CSS. Browser behavior that might improve your performance — Vadim Makeev
Your website might be ready to adapt to any viewport. But why should users wait for irrelevant desktop styles when they load it on mobile?
How to transfigure wireframes into HTML - HTMHell
A collection of bad practices in HTML, copied from real websites.
This website uses a variable font
How hours of debugging can save minutes of reading, and more takeaways from sprucing up the type on this website.
An Interactive Guide to Flexbox
Flexbox is a remarkably powerful layout mode. When we truly understand how it works, we can build dynamic layouts that respond automatically, rearranging themselves as-needed.
Alpine.js
A rugged, minimal framework for composing behavior directly in your markup.
Inside the mind of a frontend developer: Hero section - Ahmad Shadeed
An exploration of how a frontend developer thinks while building a simple hero section.
Regex Generator - Creating regex is easy again!
A tool to generate simple regular expressions from sample text. Enable less experienced developers to create regex smoothly.
Fallback Font Generator
Reduce Cumulative Layout Shift (CLS) by adjusting web fonts and system font fallbacks using @font-face
The Infinite Marquee | Ryan Mulligan
A responsive looping marquee-style animation using HTML and CSS
⌘K
Fast, composable, unstyled command menu for React.
Fluid Sizing Instead Of Multiple Media Queries? — Smashing Magazine
If you like math and CSS, you’ll love this one. We don’t need to use media queries to change the values of some CSS properties — *font-size*, *padding*, *margin* etc. — depending on the viewport width, with the CSS `clamp` function. But: we still need to use media queries for changing colors, borders, shadows and other CSS styles.
Intermediate HTML and CSS | The Odin Project
The Odin Project empowers aspiring web developers to learn together for free
Foundations | The Odin Project
The Odin Project empowers aspiring web developers to learn together for free
How to Create a Cover Page Transition - Codrops
Today we are looking under the hood of a page transition based on Vitalii Burhonskyi's Dribbble shot.
URL-encoder for SVG
GitHub - djrrb/Python-For-Visual-Designers-2020: Resources for my Type@Cooper course
Resources for my Type@Cooper course. Contribute to djrrb/Python-For-Visual-Designers-2020 development by creating an account on GitHub.
Beginners resources - Python resources for everybody
Curated list of learning resources for all sorts of Python usage
Raster—CSS Grid System
Welcome! | Python for Designers
An introductory manual to Python3 and DrawBot
Min-Max-Value Interpolation
A tool that calculates the CSS clamp formula to interpolate between two values in a given viewport range.
How to password protect a static site on Vercel, Netlify, or any JAMStack site | Al Power
Eleventy (11ty) Tutorial
Mechanical Ragger: Print typesetting for the web
The web has never been a place for perfectionism. Typesetting in particular has been a long-neglected facet of web design because we’ve lacked the tools to give long texts the editorial care they need.
Building a button component
A foundational overview of how to build color-adaptive, responsive, and accessible button components.
fullPage scroll snapping. Create full screen pages fast and simple
Mouse wheel snap to sections. Fast and simple to use.
GitHub - hotwired/turbo: The speed of a single-page web application without having to write any JavaScript
The speed of a single-page web application without having to write any JavaScript - GitHub - hotwired/turbo: The speed of a single-page web application without having to write any JavaScript