Pinboard (chrismasters)
https://pinboard.in/u:chrismasters/public/
recent bookmarks from chrismastersModern Font Stacks2023-07-20T15:14:42+00:00
https://modernfontstacks.com/
chrismastersSystem font stack CSS organized by typeface classification for every modern OS. The fastest fonts available. No downloading, no layout shifts, no flashes — just instant renders.]]>typography web fonts design css font webdesign fontstackhttps://pinboard.in/u:chrismasters/b:75cb2f1c0ff9/How to animate gradients in CSS and React2023-06-26T10:55:25+00:00
https://www.joshwcomeau.com/react/rainbow-button/
chrismastersanimate gradient houdini csshttps://pinboard.in/u:chrismasters/b:d25ebdd4faec/Frosted Glass2023-06-22T13:24:41+00:00
https://frosted-glass.shud.in/?ref=sidebar
chrismasterscss effect frostedglass blur web developmenthttps://pinboard.in/u:chrismasters/b:c9d48b84df87/The good line-height2023-05-31T09:44:06+00:00
https://www.thegoodlineheight.com/
chrismastersgrid typography design height font css toolshttps://pinboard.in/u:chrismasters/b:6b2029031648/Tailwind CSS Color Generator - UI Examples & WCAG Contrast Ratios2023-05-28T10:05:08+00:00
https://uicolors.app/create
chrismasterscolor colors design css tailwind ui generator figmahttps://pinboard.in/u:chrismasters/b:a58921df5775/Building a combined CSS-aspect-ratio-grid - 9elements2023-05-27T14:42:06+00:00
https://9elements.com/blog/building-a-combined-css-aspect-ratio-grid/
chrismasterscss grids flexbox web development layoutshttps://pinboard.in/u:chrismasters/b:5254a4c9083d/Tailwind CSS 10-color Palette Generator and API2023-03-08T19:04:16+00:00
https://www.tints.dev
chrismasterstailwind colors css hexhttps://pinboard.in/u:chrismasters/b:8382a3a6e9db/CSS { In Real Life } | Resizing with CSS2023-02-27T13:06:32+00:00
https://css-irl.info/resizing-with-css/?ref=sidebar
chrismasterscss web developmenthttps://pinboard.in/u:chrismasters/b:c9582dfc6b67/Poline — Esoteric Color Palette Generation Library2023-02-21T16:56:57+00:00
https://meodai.github.io/poline/
chrismasterscolor design generator tools palettes colors csshttps://pinboard.in/u:chrismasters/b:8f22a83e6922/RippleUI | TailwindCSS Components2023-01-18T16:50:44+00:00
https://www.ripple-ui.com/
chrismasterstailwindcss web development css styling components UIhttps://pinboard.in/u:chrismasters/b:004ca9f407c2/Gradients ⋅ Mass-Driver™ Workshop2022-12-12T11:19:55+00:00
https://workshop.mass-driver.com/gradients
chrismastersgradients code css tools background colorhttps://pinboard.in/u:chrismasters/b:b112c88731b6/The large, small, and dynamic viewport units2022-12-12T10:45:12+00:00
https://web.dev/viewport-units/
chrismastersdevelopment design css viewport height ioshttps://pinboard.in/u:chrismasters/b:481ab47ac8ec/How To Create Advanced Animations With CSS — Smashing Magazine2022-11-17T09:58:52+00:00
https://www.smashingmagazine.com/2022/10/advanced-animations-css/
chrismastersbezier design animation coding csshttps://pinboard.in/https://pinboard.in/u:chrismasters/b:303e546dcc69/The Math Behind Nesting Rounded Corners – Cloud Four2022-11-17T09:58:16+00:00
https://cloudfour.com/thinks/the-math-behind-nesting-rounded-corners/
chrismastersborder-radius css bordershttps://pinboard.in/https://pinboard.in/u:chrismasters/b:34a0847995f0/CSS Animated Grid Layouts2022-11-15T17:38:47+00:00
https://web.dev/css-animated-grid-layouts/?ref=Web-Design-Weekly.com
chrismastersdevelopment css css-grid web layouthttps://pinboard.in/https://pinboard.in/u:chrismasters/b:3a2d6d0176d6/Animated Gradient Text2022-11-15T16:57:11+00:00
https://web.dev/speedy-css-tip-animated-gradient-text/
chrismastersgradients code animation css background-cliphttps://pinboard.in/https://pinboard.in/u:chrismasters/b:d699208534d3/UI Verse2022-10-26T10:12:22+00:00
https://uiverse.io/
chrismasterscss html web design ui elements development inspirationhttps://pinboard.in/u:chrismasters/b:8055da42761d/How to Animate CSS Box Shadows and Optimize Performance - SitePoint2022-10-19T17:31:53+00:00
https://www.sitepoint.com/css-box-shadow-animation-performance/
chrismastersbox-shadow css web development performance animationhttps://pinboard.in/u:chrismasters/b:3046f37cbaeb/Delightful UI Animations With Shared Element Transitions API (Part 2) — Smashing Magazine2022-10-18T15:14:58+00:00
https://www.smashingmagazine.com/2022/10/ui-animations-shared-element-transitions-api-part2/
chrismastersfridayfrontend css animation transitions api via:spaceninjahttps://pinboard.in/u:chrismasters/b:e441db86daf6/Layout Breakouts with CSS Grid2022-10-10T13:34:23+00:00
https://ryanmulligan.dev/blog/layout-breakouts/?ref=sidebar
chrismastersweb development layout css gridhttps://pinboard.in/u:chrismasters/b:bb8f90733654/Menu to Grid Layout Animation | Codrops2022-10-10T11:55:09+00:00
https://tympanus.net/codrops/2022/09/19/menu-to-grid-layout-animation/
chrismastersanimation grid layout web development inspiration CSS greensockhttps://pinboard.in/u:chrismasters/b:ca411bed3246/Delightful UI Animations With Shared Element Transitions API (Part 1) — Smashing Magazine2022-10-05T10:06:28+00:00
https://www.smashingmagazine.com/2022/10/ui-animations-shared-element-transitions-api-part1/
chrismasterstransitions web development animation javascript css shared-elementhttps://pinboard.in/u:chrismasters/b:5f2f458d5c4a/Galaxy brain CSS tricks with Hotwire and Rails | Boring Rails: Skip the bullshit and ship fast2022-07-28T12:02:13+00:00
https://boringrails.com/articles/css-tips-and-tricks-hotwire/
chrismastersrails rubyonrails hotwire tailwindcss development web csshttps://pinboard.in/u:chrismasters/b:d3ed4e46ad44/Single Element Loaders: The Bars | CSS-Tricks - CSS-Tricks2022-07-19T12:00:39+00:00
https://css-tricks.com/single-element-loaders-the-bars/
chrismastersdesign animation coding css spinners bars loadinghttps://pinboard.in/https://pinboard.in/u:chrismasters/b:e736b5571c93/Fun Parallax Scrolling CSS for Matterday2022-06-17T10:03:34+00:00
https://www.netlify.com/blog/fun-parallax-scrolling-css-for-matterday/?ref=sidebar
chrismastersscrolling css parallax web developmenthttps://pinboard.in/u:chrismasters/b:87aee7c52b2c/Cool CSS Hover Effects That Use Background Clipping, Masks, and 3D2022-06-08T10:55:45+00:00
https://css-tricks.com/css-hover-effects-background-masks-3d/
chrismasterscss clip-path background-clip hover web developmenthttps://pinboard.in/u:chrismasters/b:a3cf6f27054a/4 Cool Hover Effects That Use CSS Text Shadow2022-06-08T10:55:07+00:00
https://css-tricks.com/cool-hover-effects-that-use-css-text-shadow/
chrismasterstexteffect css hover links web developmenthttps://pinboard.in/u:chrismasters/b:71fbfac49bbb/Min-Max-Value Interpolation2022-06-08T10:15:25+00:00
https://min-max-calculator.9elements.com/
chrismasterstypography calculator css tools clamp web developmenthttps://pinboard.in/u:chrismasters/b:96fbff2476e6/AutoAnimate - Add motion to your apps with a single line of code2022-05-24T12:40:49+00:00
https://auto-animate.formkit.com/
chrismastersweb development animation css javascript react libraryhttps://pinboard.in/u:chrismasters/b:99b9ea045e6d/Lesser-Known And Underused CSS Features In 20222022-05-24T12:35:06+00:00
https://www.smashingmagazine.com/2022/05/lesser-known-underused-css-features-2022/?ref=sidebar
chrismastersweb development csshttps://pinboard.in/u:chrismasters/b:24ca20c21a52/Frontend Practice | Become a better frontend developer.2022-05-20T11:39:13+00:00
https://www.frontendpractice.com/
chrismastersweb development training css resourcehttps://pinboard.in/u:chrismasters/b:790e9c169da7/CTA Modal - Web Component2022-05-11T13:58:03+00:00
https://host.sonspring.com/cta-modal/
chrismastersmodal HTML5 web component css accessibility a11yhttps://pinboard.in/u:chrismasters/b:ec38e50c9add/Deep Dive into Text Wrapping and Word Breaking / Coder's Block2022-05-11T09:10:45+00:00
https://codersblock.com/blog/deep-dive-into-text-wrapping-and-word-breaking/
chrismasterscss web development word-break wrapping truncationhttps://pinboard.in/u:chrismasters/b:93c83617ea56/How To Build A Great Theme Toggle Switch2022-05-11T09:10:15+00:00
https://www.webpro.nl/articles/how-to-build-a-great-theme-toggle-switch
chrismastersweb development dark light theme switch toggle csshttps://pinboard.in/u:chrismasters/b:373ceac08173/Building a combined CSS-aspect-ratio-grid2022-05-06T08:51:54+00:00
https://9elements.com/blog/combined-aspect-ratio-grid/?ref=sidebar
chrismastersweb development css aspect-ratio gridhttps://pinboard.in/u:chrismasters/b:5ea4d7207282/Animating in a newly added elements with CSS only2022-02-24T10:24:53+00:00
https://thinkdobecreate.com/articles/css-animating-newly-added-element/
chrismastersanimation css development transitions include-sitehttps://pinboard.in/u:chrismasters/b:49531b3f9bc4/A Clever Sticky Footer Technique - CSS-Tricks2021-12-14T13:17:56+00:00
https://css-tricks.com/a-clever-sticky-footer-technique/
chrismasterslayout footer design css stickyhttps://pinboard.in/https://pinboard.in/u:chrismasters/b:d46d3efe301b/Wakamai Fondue,2021-12-13T17:31:39+00:00
https://wakamaifondue.com/
chrismasterstypography fonts tools webfonts css opentype features stylisticsetshttps://pinboard.in/u:chrismasters/b:34364e3a7614/A Handy Little System for Animated Entrances in CSS - CSS-Tricks2021-12-08T14:47:06+00:00
https://css-tricks.com/a-handy-little-system-for-animated-entrances-in-css/
chrismastersanimation css frontendhttps://pinboard.in/https://pinboard.in/u:chrismasters/b:fabc87e5c6ce/Parallax Powered by CSS Custom Properties2021-11-22T11:39:51+00:00
https://css-tricks.com/parallax-powered-by-css-custom-properties/?ref=sidebar
chrismasterscss parallaxhttps://pinboard.in/https://pinboard.in/u:chrismasters/b:758c665c98d5/Smooth Shadow2021-09-20T08:00:24+00:00
https://shadows.brumm.af/
chrismastersonline generator css shadowshttps://pinboard.in/u:chrismasters/b:2174855dca93/DaisyUI2021-08-02T13:13:20+00:00
https://daisyui.com/
chrismasterscss tailwind ui design components web development via:popularhttps://pinboard.in/u:chrismasters/b:12ebb4143caa/Thinking About The Cut-Out Effect: CSS or SVG?2021-07-28T09:37:32+00:00
https://ishadeed.com/article/thinking-about-the-cut-out-effect/?ref=sidebar
chrismastersavatars cutout SVG CSS web development article techniquehttps://pinboard.in/u:chrismasters/b:75a7e2bbc977/Clip-path converter2021-07-28T09:30:12+00:00
https://yoksel.github.io/relative-clip-path/
chrismasterscss tools clip-path resources web developmenthttps://pinboard.in/u:chrismasters/b:e5efaf96f7c8/Typewriter Animation That Handles Anything You Throw at It2021-07-23T11:06:33+00:00
https://css-tricks.com/typewriter-animation-that-handles-anything-you-throw-at-it/
chrismastersanimation css effects typing javascript web developmenthttps://pinboard.in/u:chrismasters/b:4601315385bd/Trigonometry in CSS and JavaScript: Beyond Triangles | Codrops2021-07-07T10:21:36+00:00
https://tympanus.net/codrops/2021/06/04/trigonometry-in-css-and-javascript-beyond-triangles/?ref=sidebar
chrismastersjavascript css trigonometryhttps://pinboard.in/u:chrismasters/b:c7a35aa40267/CSS { In Real Life } | Animating Underlines2021-03-31T16:57:00+00:00
https://css-irl.info/animating-underlines/
chrismasterscss underline text web developmenthttps://pinboard.in/u:chrismasters/b:1882f4bd9208/In Praise of the Unambiguous Click Menu | CSS-Tricks2021-03-22T09:16:45+00:00
https://css-tricks.com/in-praise-of-the-unambiguous-click-menu/
chrismasterscss navigation ux a11y menu via:popularhttps://pinboard.in/u:chrismasters/b:62434e753d35/CSS Grid Cheat Sheet Illustrated in 2021🎖️ - DEV Community2021-03-10T19:13:52+00:00
https://dev.to/joyshaheb/css-grid-cheat-sheet-illustrated-in-2021-1a3
chrismastersweb development css css-gridhttps://pinboard.in/u:chrismasters/b:ad28a2d16d68/content-visibility: the new CSS property that boosts your rendering performance2021-03-10T14:45:17+00:00
https://web.dev/content-visibility/
chrismasterscss performance chrome layout IFTTT via:popularhttps://pinboard.in/u:chrismasters/b:7fb2c9482103/Getting Deep into Shadows | CSS-Tricks2021-02-24T23:02:06+00:00
https://css-tricks.com/getting-deep-into-shadows/
chrismastersweb development css shadowshttps://pinboard.in/u:chrismasters/b:3662143c6463/Create Responsive Image Effects With CSS Gradients And aspect-ratio — Smashing Magazine2021-02-24T18:52:27+00:00
https://www.smashingmagazine.com/2021/02/responsive-image-effects-css-gradients-aspect-ratio/
chrismasterscss aspect-ratio blend-mode object-fit web developmenthttps://pinboard.in/u:chrismasters/b:610158c69b81/A simple custom – HTML Accessibility2021-01-26T17:50:37+00:00
https://html5accessibility.com/stuff/2021/01/24/a-simple-custom/
chrismastersCSS styling input field web developmenthttps://pinboard.in/u:chrismasters/b:4c063bc84874/The importance of `@font-face` source order when used with preload - Matt Hobbs2021-01-23T11:57:09+00:00
https://nooshu.github.io/blog/2021/01/23/the-importance-of-font-face-source-order-when-used-with-preload/
chrismastersfont embedding web development css preloadhttps://pinboard.in/u:chrismasters/b:218d287e5694/Shuffle2021-01-20T11:39:03+00:00
https://shuffle.dev/
chrismastersdesign tools ui bootstrap css web development via:popularhttps://pinboard.in/u:chrismasters/b:c55ab2f8fc2f/Keyframes2021-01-05T19:25:19+00:00
https://keyframes.app/
chrismastersweb development animation css timelinehttps://pinboard.in/u:chrismasters/b:225864e5e698/Beautiful CSS 3D Transform Perspective Examples2020-10-09T10:04:55+00:00
https://polypane.app/css-3d-transform-examples/
chrismasterscss 3D transforms development animation via:popularhttps://pinboard.in/u:chrismasters/b:d75eba22104b/Josh Comeau2020-10-06T09:58:55+00:00
https://joshwcomeau.com/
chrismastersCSS React Animation Javascripthttps://pinboard.in/https://pinboard.in/u:chrismasters/b:3aeb79e82fc4/Ten modern layouts in one line of CSS2020-08-03T14:39:58+00:00
https://web.dev/one-line-layouts/
chrismasterscss layout grid tips cssgrid via:popularhttps://pinboard.in/u:chrismasters/b:b241a22f7b44/Progressively enhancing radio buttons with SVG whilst staying accessible | Christian Heilmann2020-05-07T08:54:11+00:00
https://christianheilmann.com/2020/05/05/progressively-enhancing-radio-buttons-with-svg-whilst-staying-accessible/
chrismastersradio input buttons development web styling css svghttps://pinboard.in/u:chrismasters/b:a56884392417/Ahmad Shadeed Blog2020-04-13T08:54:22+00:00
https://ishadeed.com/articles/
chrismasterscss web development overflow images auto blendinghttps://pinboard.in/u:chrismasters/b:3e2665ba751d/<css-doodle />2020-04-12T16:51:31+00:00
https://css-doodle.com/
chrismasterscss development webhttps://pinboard.in/u:chrismasters/b:e6c510dc9030/Tailwind Dark/Light mode css2020-04-03T14:34:04+00:00
https://logaretm.com/blog/2020-02-08-tailwind-dark-mode/
chrismasterstailwind tailwindcss css development webhttps://pinboard.in/https://pinboard.in/u:chrismasters/b:d08f51eb58f5/line-clamp | CSS-Tricks2020-03-06T10:29:34+00:00
https://css-tricks.com/almanac/properties/l/line-clamp/
chrismasterscss twitter lineclamp truncate multilinehttps://pinboard.in/https://pinboard.in/u:chrismasters/b:85f37538bd45/Dark mode in a website with CSS2019-10-10T09:36:24+00:00
https://tombrow.com/dark-mode-website-css
chrismastersdarkmode css web developmenthttps://pinboard.in/https://pinboard.in/u:chrismasters/b:d4c3810db8a1/Hello darkness, my old friend2019-10-10T09:36:06+00:00
https://web.dev/prefers-color-scheme#invert-vector-graphics-and-icons
chrismastersdarkmode css web developmenthttps://pinboard.in/https://pinboard.in/u:chrismasters/b:b6170e3a39ce/A Modern CSS Reset - Andy Bell2019-10-07T10:28:23+00:00
https://hankchizljaw.com/wrote/a-modern-css-reset/
chrismastersbestpractices reset css webdesignhttps://pinboard.in/https://pinboard.in/u:chrismasters/b:e6069c97698d/Keyshape2019-09-28T14:24:28+00:00
https://www.keyshapeapp.com/
chrismastersanimation CSS SVG toolhttps://pinboard.in/u:chrismasters/b:d87220060730/css-camera2019-09-19T12:07:47+00:00
https://woodneck.github.io/css-camera/
chrismasterscss 3D jshttps://pinboard.in/https://pinboard.in/u:chrismasters/b:26d93d74da3d/Ghost Buttons with Directional Awareness in CSS2019-09-19T10:30:43+00:00
https://css-tricks.com/ghost-buttons-with-directional-awareness-in-css/
chrismastersanimation button buttons css designdetailhttps://pinboard.in/https://pinboard.in/u:chrismasters/b:462fa5a65e79/