• inclusive research

• designing for the screen reader experience

• keyboard only focus styles

• figma a11y annotation kit (Indeed)

• applying a11y heuristics to a wireframe (Deque)

• accessibility bluelines

• screen reader UX tips - BBC

• text-based wireframes

• favicons

• magazing layout grid

• trans-inclusive design (examples: here, and)

• UX research guide

• focus orderer Micrsosoft's Figma plugin

• access custom properties in JS

• responsively custom browser to develop responsive pages/sites/apps

• case studies

• designing for accessibility and inclusion lenses of accessibility in design

• google motion direct helps designers experiment with motion

• css.gg icons (alternative to font-awesome)

• accessibility for designers

• leonardocolor powerful color tool

• AccessAbility 2: A Practical Handbook on Accessible Graphic Design

• toolbox toolbox

• neumorphism

• utopia fluid type

• responsive grid with no media queries

• 7 GUIs A GUI Programming Benchmark

• style-sheet Fast styles in JavaScript with support for static CSS extraction.

• every-layout

• uibot generated design

• css snippets

• fontdrop explain font data

• no style design system

• tailwind utility css framework

• responsive typography

• css for legibility typography

• autodraw create clip art from simple drawings

• rtl styling design tips for right-to-left languages

• boilerform simple forms and patterns

• leonardocolor color palette tool

• happyhues color palette tool

• goron design tokens without sass

• component matrix

• responsive grid without media query

• masonry in CSS

• mailtoui enhance mailto: links

• shepard give users a tour of your app

• flexulator calculator for flex

• form design

• sketch constructor manipulate sketch files in js

• cloudflare color palette designer

• culori color manipulation library

• GrapesJS visual template builder

• CSS indexes specifications for all CSS properties

• colorbox

• style dictionary

• design system resources list

• emoji cursor

• grid by example

• evergreen react ui framework (by segment)

• eui elastic design system (react/vanilla)

• Origami FT design system

• design ethics

• documenting components (design systems)

• fullbleed

• vanilla framework a11y front-end framework from ubuntu team

• wtfforms simple form controls

• SEEK tearsheet

• cognitive overload

• bias interrupters

• clarity

• ethical design

• breaking web conventions

• boring design systems

• CX vs UX

• system-ui font

• 10 design practices for business value

• mobiscroll ui patterns commercial solutions

• framework adoption

Container queries

• css reactive component
• filament/cq
• holy albatross
• watched-box

UX Wireframes

• iplayer wireframes from bbc
• how-to bbc
• sketch app resource
• wireframe (smashing mag)

CSS snippets

• collection

Future

• eqcss element queries polyfill (IE8+)

Screenless (voice)

• a11y in conversational interfaces
• guidelines

CSS in JS

• styling language
• fela bindings for most popular frameworks
• styleable custom pseudo selectors

CSS Grid

• column setter float and flex sass mixin
• 📹 layout land
• 📹 free training
• css grid examples
• playground
• learn css grid
• jen simmons lab
• CSSDevConf preso
• Slack example

Lists

• pattern library director
• awesome design

Photography

• google nik

Guides

• text input highlight
• viewports
• Miller's Law
• SVGs
• SVG filters
• svg clip path color
• styling SVG use content
• seek styleguide
• practical typography
• microcopy
• styleguides.io
• adele collection of style guides
• patternlab.io
• design systems handbook
• awesome design systems
  • adele gallery of design systems
  • vmware clarity pattern lib with angular modules
• css-locks
• design system vs pattern library vs style guide
• maintainable css architecture
• style-guide-guide
• convert bootstrap to css grid
• semantic vs atomic
• typography for developers
• css grid
• styled components
• design forms do's and don'ts
• resilient web design
• modal no js
• rethinking design
• 8 rules for css architecture
• CSS inheritance (Heydon Pickering)
• design for accessibility - bbc
• flexbox
• flexbox pres
• front-end style guides
• ethics of data use
• rail (performance)
• 18f
• forms - 10 commandments
• forms best practice
• em vs rem
• flexbugs
• responsive images
• layzr for lazy images
• collection of guides
• design principles examples of design principles

Forms

• react-jsonschema-form generate forms from json schema
• field-kit control text inputs
• uniform styleable form elements (jQuery)

Frameworks

• spectrum adobe's design system
• mineralUI accessible, themeable pattern library
• IBM carbon
• inclusive components
• ebay-mind patterns
• cauldron deque pattern lib
• GEL BBC pattern lib
• a11ystyle
• a11y project
• lona design system annotation
• o-grid FT grid system
• semantic-ui
• vanilla
• propeller
• muuri Responsive, sortable, filterable and draggable grid layouts
• tufte readable typography
• ant-design
• styled components react with css in template literals
• primer github's framework
• flexboxgrid bootstraps classes in a flexbox implementation
• lumx (angular, material design)
• tacit (classless)
• post future animations
• material design
  • material components web
  • movement
  • materialup (material design gallery)
  • materialize
  • icons
  • bootstrap
  • html5 material
  • framework

Galleries and Style Guides

• design system skaffold
• button focus styles
• styleguide checklist
• cssreference
• openspace
• component style guide
• smashing mag design guide

Icons

• boxy online SVG editor
• inkscape free vector drawing program (export as optimized)
• simple icons popular brands as svg
• svg icons as a service
• bytesize icons svg icons
• performant icons
• octicons
• svg4everybody polyfill for external svg sprite sheets

Tools

• vectr free SVG editing tool
• reframe make iframes responsive
• html-sketchapp convert html to sketch layers/symbols
• Theo tool for design tokens
• contrast-grid
• emergence detect visibility IE8+
• scrollama visibility and sticky using IntersectionObserver
• postcss-stle-guide
• image-trace-loader svg traces of images
• forcefeed force content into html to test design responsiveness
• react sketchapp
• resemble image image fallback gradient
• specificity calculate css selector specificity
• griddy css grid
• crossfilter data filtering and grouping
• material.io
• aphrodite inline styles for react-like apps
• colorguard
• css2less
• turbolinks
• force feed generative testing for layouts
• pesticide (visualize css layouts)
• [kss](http://warpspire.com/kss/} (generate styleguide docs)
• centering
• icomoon
• stylelint primer
• online indicate connectivity in app
• cssential inline annotated styles

Techniques

• touch list of examples for touch events
• ui-design
• carousel and part 2
• you don't need js
• chrome-ui samples
• svg-sprite node tool

Emails

• email is good general email advice
• mjml article Responsive emails

Fonts

• ebay-font font loading utility

Typography

• fluid type sizing with css var
• fonts for data
• font inspector
• font-smooth
• vertical rhythm without collapsing margins
• tufte-css book style typography
• typography of tables