{"id":649,"date":"2019-11-25T12:49:49","date_gmt":"2019-11-25T17:49:49","guid":{"rendered":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/?page_id=649"},"modified":"2020-02-26T21:37:18","modified_gmt":"2020-02-27T02:37:18","slug":"links","status":"publish","type":"page","link":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/links\/","title":{"rendered":"Resources"},"content":{"rendered":"\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p>A growing list of resources that I like and use: Tools and inspiration for making websites.<\/p>\n\n\n\n<p>95 and counting <\/p>\n\n\n<!-- Beginning of Link Library Output --><div id='linklist1' class='linklist'><!-- Div Linklist -->\n<div class=\"LinkLibraryCat LinkLibraryCat135 level0\"><!-- Div Category --><div id=\"color-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Color Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/0to255.com\/\" id=\"link-1246\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">0to255<\/a>\n - This was a most useful color picker that I used to use on all my projects. I haven&#039;t used it in years now and it&#039;s paid so I have no idea what it is like now..<\/li>\n<li><a href=\"https:\/\/calcolor.co\/\" id=\"link-809\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">calcolor.co | Calculate colors. Share palettes.<\/a>\n - Versatile color tool that creates palettes and blend steps<\/li>\n<li><a href=\"https:\/\/colordesigner.io\/color-name-finder\" id=\"link-1295\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Color Name Finder<\/a>\n - Yes! What you&#039;ve always wanted: find the name of that color \ud83d\ude42<\/li>\n<li><a href=\"https:\/\/colors.lol\/\" id=\"link-970\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">colors.lol &#8211; Overly descriptive color palettes<\/a>\n - Not only overly descriptive but very zany tangy color palettes<\/li>\n<li><a href=\"https:\/\/colors.eva.design\/\" id=\"link-923\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Eva Design System: Deep learning color generator<\/a>\n - Create a semantic color palette for succes, info, warning and danger<\/li>\n<li><a href=\"https:\/\/hexcolor.co\/\" id=\"link-922\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Hex Colors &#8211; HTML Color Codes<\/a>\n - Several useful color tools, including: color inspiration, palette generator, random color<\/li>\n<li><a href=\"https:\/\/flatuicolors.com\/\" id=\"link-1031\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Palettes | Flat UI Colors \ud83c\udfa8<\/a>\n - 280 handpicked colors ready for COPY<\/li>\n<li><a href=\"https:\/\/shadegenerator.com\/\" id=\"link-1338\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">shadegenerator<\/a>\n - A very nice shadegenerator<\/li>\n<li><a href=\"https:\/\/noeldelgado.github.io\/shadowlord\/\" id=\"link-1337\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Shadowlord<\/a>\n - My current favorite color tints and shades generator tool.<\/li>\n<li><a href=\"https:\/\/coolors.co\/\" id=\"link-1308\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">The super fast color palettes generator<\/a>\n - Easy to use, many options to tweak and the basic functionality is free<\/li>\n<li><a href=\"https:\/\/www.toptal.com\/designers\/colorfilter\" id=\"link-989\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Toptal Color Blind Filter<\/a>\n - What are color blind anomalies?<\/li>\n<li><a href=\"https:\/\/www.learnui.design\/tools\/gradient-generator.html\" id=\"link-1158\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">UI Gradient Generator: Make Beautiful CSS Gradients [<\/a>\n - A gradient generator that helps you avoid a gray area in de middle<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat108 level0\"><!-- Div Category --><div id=\"css-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">CSS Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/animista.net\/\" id=\"link-732\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Animista<\/a>\n - CSS animations on demand<\/li>\n<li><a href=\"https:\/\/autoprefixer.github.io\/\" id=\"link-1009\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Autoprefixer CSS online<\/a>\n - Autoprefixer is a PostCSS plugin which parses your CSS and adds vendor prefixes<\/li>\n<li><a href=\"https:\/\/brumm.af\/shadows\" id=\"link-782\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">brumm.af\/shadows<\/a>\n - Tool to create beautifully smooth box-shadows<\/li>\n<li><a href=\"https:\/\/codemyui.com\/tag\/pure-css\/\" id=\"link-725\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Code My UI: Web Design &#038; UI Inspiration with Code Snippets<\/a>\n - Pure CSS Only Code Snippets<\/li>\n<li><a href=\"https:\/\/cooltipz.jackdomleo.dev\/\" id=\"link-1082\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Cooltipz.css<\/a>\n - Cool customisable tooltips made from pure CSS<\/li>\n<li><a href=\"https:\/\/ishadeed.com\/article\/css-has-guide\" id=\"link-1261\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS :has() Interactive Guide<\/a>\n - An extensive guide to CSS :has() selector<\/li>\n<li><a href=\"https:\/\/wweb.dev\/resources\/css-separator-generator\" id=\"link-1144\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS Section Separator Generator | wweb.dev<\/a>\n - <\/li>\n<li><a href=\"https:\/\/leaverou.github.io\/css3patterns\/#\" id=\"link-969\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS3 Patterns Gallery<\/a>\n - CSS background patterns to add to your stylesheet, tileable and adjustable.<\/li>\n<li><a href=\"https:\/\/cssjanus.github.io\/#input\/\" id=\"link-825\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSSJanus<\/a>\n - Tool to help you with the CSS of rtl &amp; ltr styling<\/li>\n<li><a href=\"https:\/\/cubic-bezier.com\/#.17,.67,.83,.67\" id=\"link-781\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">cubic-bezier(.17,.67,.83,.67) \u273f cubic-bezier.com<\/a>\n - Tool to help you create smooth transitions and animations<\/li>\n<li><a href=\"https:\/\/9elements.github.io\/fancy-border-radius\/\" id=\"link-789\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Fancy Border Radius Generator<\/a>\n - Make all kinds of shapes using only border-radius<\/li>\n<li><a href=\"https:\/\/the-echoplex.net\/flexyboxes\/\" id=\"link-800\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Flexy Boxes \u2014 CSS flexbox playground and code generation tool<\/a>\n - flexbox playground and code generator<\/li>\n<li><a href=\"https:\/\/gwfh.mranftl.com\/fonts\" id=\"link-799\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">google webfonts helper<\/a>\n - A Hassle-Free Way to Self-Host Google Fonts<\/li>\n<li><a href=\"https:\/\/www.rtlstyling.com\/posts\/rtl-styling\/\" id=\"link-783\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Right-to-left Styling<\/a>\n - Extensive documentation with good, clear examples<\/li>\n<li><a href=\"https:\/\/www.sarasoueidan.com\/blog\/inclusively-hiding-and-styling-checkboxes-and-radio-buttons\/\" id=\"link-1307\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Sara Soueidan<\/a>\n - Inclusively Hiding &amp; Styling Checkboxes and Radio Buttons<\/li>\n<li><a href=\"https:\/\/css-tricks.com\/the-shapes-of-css\/\" id=\"link-924\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">The Shapes of CSS | CSS-Tricks<\/a>\n - A whole list with wonderful shapes made in CSS, from the basics to the complex<\/li>\n<li><a href=\"https:\/\/www.learnui.design\/tools\/gradient-generator.html\" id=\"link-1158\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">UI Gradient Generator: Make Beautiful CSS Gradients [<\/a>\n - A gradient generator that helps you avoid a gray area in de middle<\/li>\n<li><a href=\"http:\/\/youmightnotneedjs.com\/\" id=\"link-778\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">You Might Not Need JavaScript<\/a>\n - You can build so many functional UI components without the additional dependancy<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat137 level0\"><!-- Div Category --><div id=\"font-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Font Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/coolors.co\/fonts\" id=\"link-1339\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Coolors Fonts<\/a>\n - Browse hundreds of free fonts for your projects.<\/li>\n<li><a href=\"https:\/\/www.cssfontstack.com\/\" id=\"link-930\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS Font Stack: Web Safe and Web Font Family with HTML and CSS code.<\/a>\n - A complete collection of web safe CSS font stacks.<\/li>\n<li><a href=\"https:\/\/fontsinuse.com\/\" id=\"link-1020\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Fonts In Use \u2013 Type at work in the real world.<\/a>\n - An independent archive of typography, good for inspiration.<\/li>\n<li><a href=\"https:\/\/practicaltypography.com\/system-fonts.html\" id=\"link-929\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">System fonts | Butterick\u2019s Practical Typography<\/a>\n - A delicious website on fonts. This page is specifically on system fonts.<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat85 level0\"><!-- Div Category --><div id=\"general\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">General<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/tiny-helpers.dev\/\" id=\"link-788\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">All \u2013 Tiny Helpers<\/a>\n - A nice list of resources for making websites (like this one but dedicated just to that)<\/li>\n<li><a href=\"https:\/\/wp-cli.org\/\" id=\"link-914\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Command line interface for WordPress | WP-CLI<\/a>\n - Working on WordPress without opening your browser<\/li>\n<li><a href=\"https:\/\/www.favicon-generator.org\/\" id=\"link-843\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Favicon &#038; App Icon Generator<\/a>\n - Generates all the different size icons and the CSS<\/li>\n<li><a href=\"https:\/\/bighack.org\/how-to-write-better-alt-text-descriptions-for-accessibility\/\" id=\"link-1142\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">How to write better alt-text descriptions for accessibility | The Big Hack<\/a>\n - <\/li>\n<li><a href=\"https:\/\/jsonlint.com\/\" id=\"link-988\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">JSONLint &#8211; The JSON Validator<\/a>\n - JSONLint is a validator and reformatter for JSON, a lightweight data-interchange format.<\/li>\n<li><a href=\"https:\/\/nomoregoogle.com\/\" id=\"link-833\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">No More Google<\/a>\n - Privacy-friendly alternatives to Google that don&#039;t track you<\/li>\n<li><a href=\"https:\/\/resilientwebdesign.com\/introduction\/\" id=\"link-839\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Resilient Web Design\u2014Introduction<\/a>\n - A history book on the evolution of the web with suggestions for the future<\/li>\n<li><a href=\"https:\/\/www.websitecarbon.com\" id=\"link-694\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Website Carbon Calculator<\/a>\n - How is your website impacting the planet?<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat88 level0\"><!-- Div Category --><div id=\"html-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">HTML Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/better-mobile-inputs.netlify.app\/\" id=\"link-976\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Build a Better Mobile Input<\/a>\n - A nice tool which helps you configure a few key input attributes, that can make web forms much easier to use on mobile devices.<\/li>\n<li><a href=\"https:\/\/wweb.dev\/resources\/css-separator-generator\" id=\"link-1144\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS Section Separator Generator | wweb.dev<\/a>\n - <\/li>\n<li><a href=\"https:\/\/www.htmlsymbols.xyz\/\" id=\"link-660\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">HTML Symbols<\/a>\n - A very vast, searchable collection of HTML symbols<\/li>\n<li><a href=\"https:\/\/www.toptal.com\/designers\/htmlarrows\/\" id=\"link-707\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">HTML Symbols, Entities, Characters and Codes \u2014 HTML Arrows<\/a>\n - A delightful reference for HTML Symbols, Entities and ASCII Character Codes<\/li>\n<li><a href=\"https:\/\/gillmeister-software.com\/online-tools\/text\/remove-line-breaks.aspx\" id=\"link-987\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Remove\/Replace line breaks online<\/a>\n - Extremely convenient tool with which to remove or replace line breaks<\/li>\n<li><a href=\"https:\/\/www.rtlstyling.com\/posts\/rtl-styling\/\" id=\"link-783\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Right-to-left Styling<\/a>\n - Extensive documentation with good, clear examples<\/li>\n<li><a href=\"https:\/\/www.sarasoueidan.com\/blog\/inclusively-hiding-and-styling-checkboxes-and-radio-buttons\/\" id=\"link-1307\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Sara Soueidan<\/a>\n - Inclusively Hiding &amp; Styling Checkboxes and Radio Buttons<\/li>\n<li><a href=\"https:\/\/www.compart.com\/en\/unicode\/\" id=\"link-1258\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Unicode &#8211; Compart<\/a>\n - A searchable collection of unicode characters<\/li>\n<li><a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#input-purposes\" id=\"link-1233\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">W3: form input purposes<\/a>\n - Giving a form input field a standardized input purpose, can help browsers auto-fill the form<\/li>\n<li><a href=\"http:\/\/youmightnotneedjs.com\/\" id=\"link-778\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">You Might Not Need JavaScript<\/a>\n - You can build so many functional UI components without the additional dependancy<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat87 level0\"><!-- Div Category --><div id=\"image-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Image Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/tartanify.com\/\" id=\"link-968\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">5k Tartan Patterns | Tartanify.com<\/a>\n - Tileable Tratan background images<\/li>\n<li><a href=\"https:\/\/allsvgicons.com\/\" id=\"link-1341\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">All SVG Icons<\/a>\n - Browse and download 250,000+ free SVG icons from 220 carefully curated icon libraries.<\/li>\n<li><a href=\"https:\/\/www.blobmaker.app\/\" id=\"link-752\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Blobmaker<\/a>\n - Create SVG blobs in any color, download and use<\/li>\n<li><a href=\"https:\/\/wweb.dev\/resources\/css-separator-generator\" id=\"link-1144\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS Section Separator Generator | wweb.dev<\/a>\n - <\/li>\n<li><a href=\"https:\/\/leaverou.github.io\/css3patterns\/#\" id=\"link-969\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS3 Patterns Gallery<\/a>\n - CSS background patterns to add to your stylesheet, tileable and adjustable.<\/li>\n<li><a href=\"https:\/\/edit.photo\/\" id=\"link-656\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Edit.Photo<\/a>\n - Free online image editor I actually like, for when I just need a quick edit and don&#039;t want to open software for it<\/li>\n<li><a href=\"https:\/\/www.favicon-generator.org\/\" id=\"link-843\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Favicon &#038; App Icon Generator<\/a>\n - Generates all the different size icons and the CSS<\/li>\n<li><a href=\"https:\/\/icons.theforgesmith.com\/\" id=\"link-1021\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Forge Icons<\/a>\n - 300 right mix of SVG icons for use in e-commerce, travel, social media, app design and much more.<\/li>\n<li><a href=\"https:\/\/getwaves.io\/\" id=\"link-751\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Get Waves \u2013 Create SVG waves for your next design<\/a>\n - Waves in any color you like, download and use<\/li>\n<li><a href=\"https:\/\/gratisography.com\/\" id=\"link-1102\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Gratisography &#8211; Free High-Resolution Photos<\/a>\n - FREE USE-AS-YOU-PLEASE PICTURES THAT STAND OUT! Truly unique. Usually whimsy \ud83d\ude09 Always free.<\/li>\n<li><a href=\"https:\/\/heropatterns.com\/\" id=\"link-798\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Hero Patterns | Free repeatable SVG background patterns for your web projects<\/a>\n - A collection of repeatable SVG background patterns for you to use on your web projects.<\/li>\n<li><a href=\"https:\/\/hero-generator.netlify.app\/\" id=\"link-1143\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">hero-generator<\/a>\n - Helps you create a nice header for your website (not intended for use with WordPress)<\/li>\n<li><a href=\"https:\/\/www.craigabbott.co.uk\/blog\/how-to-write-good-alt-text-for-screen-readers\/\" id=\"link-1253\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">How to write good alt text for screen readers<\/a>\n - What is alt text, why does it matter, and how to avoid some common mistakes<\/li>\n<li><a href=\"https:\/\/jpeg.rocks\/\" id=\"link-1154\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">JPEG.rocks: Privacy-aware JPEG optimizer<\/a>\n - <\/li>\n<li><a href=\"https:\/\/icons8.com\/line-awesome\" id=\"link-1139\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Line Awesome \u2014 Free Beautiful Icon Font<\/a>\n - Swap Font Awesome for modern line icons in one line of code.<\/li>\n<li><a href=\"http:\/\/www.noisetexturegenerator.com\/\" id=\"link-967\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Noise Texture Generator v2.1<\/a>\n - Create a tileable background image with noise<\/li>\n<li><a href=\"https:\/\/openverse.org\/\" id=\"link-1244\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Openverse<\/a>\n - Openly licensed images, audio and more<\/li>\n<li><a href=\"https:\/\/andrewfulrich.gitlab.io\/panelle\/\" id=\"link-1153\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Panelle.js &#8211; free comic book layout maker<\/a>\n - <\/li>\n<li><a href=\"https:\/\/vincentgarreau.com\/particles.js\/\" id=\"link-977\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">particles.js &#8211; A lightweight JavaScript library for creating particles<\/a>\n - A tool to help you create animated and interactive particles for your website<\/li>\n<li><a href=\"https:\/\/phosphoricons.com\/\" id=\"link-1145\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Phosphor Icons<\/a>\n - Phosphor is a flexible icon family for interfaces, diagrams, presentations<\/li>\n<li><a href=\"https:\/\/www.svgbackgrounds.com\/\" id=\"link-1179\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">SVG Backgrounds &#8211; Customize and apply backgrounds fast<\/a>\n - SVG backgrounds that are easy to customize<\/li>\n<li><a href=\"https:\/\/www.learnui.design\/tools\/gradient-generator.html\" id=\"link-1158\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">UI Gradient Generator: Make Beautiful CSS Gradients [<\/a>\n - A gradient generator that helps you avoid a gray area in de middle<\/li>\n<li><a href=\"https:\/\/css-tricks.com\/unconventional-stock-image-sources\/\" id=\"link-1123\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Unconventional Stock Image Sources  CSS-Tricks<\/a>\n - Compatible with GPL<\/li>\n<li><a href=\"https:\/\/unsplash.com\/\" id=\"link-657\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Unsplash<\/a>\n - Beautiful free images and pictures, often good for inspiration too<\/li>\n<li><a href=\"https:\/\/www.visiwig.com\/\" id=\"link-1152\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">VISIWIG | Visuals for busy designers<\/a>\n - click + paste graphics: icons, patterns, textures<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat116 level0\"><!-- Div Category --><div id=\"js-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">JS related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/datatables.net\/\" id=\"link-1292\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">DataTables<\/a>\n - DataTables is a Javascript HTML table enhancing library. It is a highly flexible tool, built upon the foundations of progressive enhancement, that adds advanced features to any HTML table.<\/li>\n<li><a href=\"https:\/\/listjs.com\/\" id=\"link-1291\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">list.js<\/a>\n - Tiny, invisible and simple, yet powerful and incredibly fast vanilla JavaScript that adds search, sort, filters and flexibility to plain HTML lists, tables, or anything.<\/li>\n<li><a href=\"http:\/\/youmightnotneedjs.com\/\" id=\"link-778\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">You Might Not Need JavaScript<\/a>\n - You can build so many functional UI components without the additional dependancy<\/li>\n<li><a href=\"http:\/\/youmightnotneedjquery.com\/\" id=\"link-779\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">You Might Not Need jQuery<\/a>\n - Please take a moment to consider if you actually need jQuery as a dependency.<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat93 level0\"><!-- Div Category --><div id=\"places-to-learn\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Places to Learn<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/ishadeed.com\/article\/css-has-guide\" id=\"link-1261\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS :has() Interactive Guide<\/a>\n - An extensive guide to CSS :has() selector<\/li>\n<li><a href=\"https:\/\/flukeout.github.io\/#\" id=\"link-756\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">CSS Diner &#8211; Where we feast on CSS Selectors!<\/a>\n - Learn the nitty gritty of CSS selectors and practice using them<\/li>\n<li><a href=\"https:\/\/www.youtube.com\/user\/DesignCourse\/playlists\" id=\"link-668\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">DesignCourse<\/a>\n - Youtube Channel<\/li>\n<li><a href=\"https:\/\/www.freecodecamp.org\/\" id=\"link-1310\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">freeCodeCamp<\/a>\n - Build your skills for free, very broad and in-depth curriculum<\/li>\n<li><a href=\"https:\/\/frontendmasters.com\/guides\/front-end-handbook\/2019\/?\" id=\"link-784\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Front-end Developer Handbook 2019 &#8211; Learn the entire JavaScript, CSS and HTML development practice!<\/a>\n - This is a guide that everyone can use to learn about the practice of front-end development. It broadly outlines and discusses the practice of front-end engineering: how to learn it and what tools are used when practicing it in 2019.<\/li>\n<li><a href=\"https:\/\/www.digitalocean.com\/community\/tutorial-series\/how-to-code-in-php\" id=\"link-1277\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">How to Code in PHP<\/a>\n - An introduction in coding with PHP<\/li>\n<li><a href=\"https:\/\/www.kogics.net\/\" id=\"link-1313\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Kogics Foundation and Kojo<\/a>\n - Intended for kids and with its own coding language and app to learn in<\/li>\n<li><a href=\"https:\/\/scratch.mit.edu\/\" id=\"link-1314\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Scratch<\/a>\n - Intended for kids, with its own coding language and offering a simple visual interface<\/li>\n<li><a href=\"https:\/\/selectstarsql.com\/\" id=\"link-757\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Select Star SQL<\/a>\n - This is a free interactive book which aims to be the best place on the internet for learning SQL.<\/li>\n<li><a href=\"https:\/\/www.theodinproject.com\/\" id=\"link-1311\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">The Odin Project<\/a>\n - The original open source online web development curriculum<\/li>\n<li><a href=\"https:\/\/mystery.knightlab.com\/\" id=\"link-753\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">The SQL Murder Mystery<\/a>\n - Practice SQL skills<\/li>\n<li><a href=\"https:\/\/github.com\/veltman\/clmystery\" id=\"link-758\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">veltman\/clmystery: A command-line murder mystery<\/a>\n - Learn more about the command line<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat96 level0\"><!-- Div Category --><div id=\"security-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Security Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/veiliginternetten.nl\/privacyverklaring\/\" id=\"link-683\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Privacyverklaring generator<\/a>\n - Stap voor stap een Privacyverklaring opstellen<\/li>\n<li><a href=\"https:\/\/www.internet.nl\/\" id=\"link-682\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Test voor moderne Internetstandaarden zoals IPv6, DNSSEC, HTTPS, DMARC, STARTTLS en DANE.<\/a>\n - Is your internet up to date?<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat86 level0\"><!-- Div Category --><div id=\"text-related\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Text Related<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/www.blindtextgenerator.com\/lorem-ipsum\" id=\"link-652\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Blind Text Generator<\/a>\n - Lorem Ipsum Generator with different texts to draw from<\/li>\n<li><a href=\"http:\/\/generator.lorem-ipsum.info\/\" id=\"link-655\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Professional Lorem Ipsum Generator for Typographers<\/a>\n - Many options, including different languages<\/li>\n<li><a href=\"https:\/\/www.rtlstyling.com\/posts\/rtl-styling\/\" id=\"link-783\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Right-to-left Styling<\/a>\n - Extensive documentation with good, clear examples<\/li>\n<li><a href=\"https:\/\/lorem-ipsumm.com\/vegan-ipsum\/\" id=\"link-648\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Vegan Ipsum<\/a>\n - Vegan Lorem Ipsum Generator<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat127 level0\"><!-- Div Category --><div id=\"website-analytics\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">Website Analytics<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/usefathom.com\/\" id=\"link-835\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Fathom, simple analytics for bloggers<\/a>\n - Privacy-respecting website analytics, paid service<\/li>\n<li><a href=\"https:\/\/www.ionos.com\/digitalguide\/websites\/website-creation\/create-your-own-visitor-counter-how-it-works\/\" id=\"link-837\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">How to create a website visitor counter in html | Tutorial &#8211; IONOS<\/a>\n - Make your own little website counter<\/li>\n<li><a href=\"https:\/\/matomo.org\/\" id=\"link-838\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Matomo: Ethical Analytics, Powerful Insights<\/a>\n - Free self-hosted and paid cloud service website analytics<\/li>\n<li><a href=\"http:\/\/demo.openwebanalytics.com\/\" id=\"link-834\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Open Web Analytics Demo and Examples<\/a>\n - Open source, self hosted website analytics<\/li>\n<li><a href=\"https:\/\/www.simpleanalytics.com\/\" id=\"link-836\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Simple Analytics &#8211; Simple, clean, and privacy-friendly analytics<\/a>\n - Privacy-respecting website analytics, paid service<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<div class=\"LinkLibraryCat LinkLibraryCat191 level0\"><!-- Div Category --><div id=\"wordpress\"><!-- Div Category Name --><div class=\"linklistcatname\"><!-- Div Cat Name --><span class=\"linklistcatclass\">WordPress<\/span><\/div><!-- DivOrHeader --><\/div><!-- Div Category Name -->\n\t<ul>\n<li><a href=\"https:\/\/www.billerickson.net\/building-a-gutenberg-website\/#gutenberg-right-choice\" id=\"link-1104\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Gutenberg Theme Development &#8211; A Guide for WordPress Developers<\/a>\n - <\/li>\n<li><a href=\"https:\/\/learn.wordpress.org\/\" id=\"link-1141\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">Learn WordPress<\/a>\n - Workshops and Lesson Plans<\/li>\n<li><a href=\"http:\/\/wpnom.com\/\" id=\"link-1067\" class=\"track_this_link \" rel=\"noopener noreferrer\" target=\"_blank\">wpnom<\/a>\n - Key WordPress FUNCTIONS, features, filters, tips and tricks<\/li>\n\t<\/ul>\n<\/div><!-- Div End Category -->\n<script type='text\/javascript'>\njQuery(document).ready(function()\n{\njQuery('.arrow-up').hide();\njQuery('#linklist1 a.track_this_link').click(function() {\nlinkid = this.id;\nlinkid = linkid.substring(5);\npath = '';\njQuery.ajax( {    type: 'POST',    url: 'https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-admin\/admin-ajax.php',     data: { action: 'link_library_tracker',             _ajax_nonce: 'af2783b209',             id:linkid, xpath:path }     });\nreturn true;\n});\njQuery('#linklist1 .expandlinks').click(function() {\ntarget = '.' + jQuery(this).attr('id');\nsubcattarget = '.' + jQuery(this).attr('data-subcat');\nif ( jQuery( target ).is(':visible') ) {\njQuery(target).slideUp();\njQuery(subcattarget).slideToggle();\njQuery(this).children('img').attr('src', 'https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-content\/plugins\/link-library\/icons\/expand-32.png');\n} else {\njQuery(target).slideDown();\njQuery(subcattarget).slideToggle();\njQuery(this).children('img').attr('src', 'https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-content\/plugins\/link-library\/icons\/collapse-32.png');\n}\n});\njQuery('#linklist1 .linklistcatclass').click(function() {\njQuery(this).siblings('.expandlinks').click();\n});\njQuery('#linklist1 .linklistcatnamedesc').click(function() {\njQuery(this).siblings('.expandlinks').click();\n});\n});\n<\/script>\n<\/div><!-- Div Linklist -->\n<!-- End of Link Library Output -->\n\n\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<!-- Link Library Categories Output -->\n\n<div id=\"linktable\" class=\"linktable\"><form name='catselect'><select onchange='showcategory( jQuery(\".catdropdown1\").val() )' name='catdropdown1' class='catdropdown catdropdown1' data-linklist-id='1'><option value=\"\">Select a category<\/option>\t<option value=\"#color-related\">Color Related<span class=\"linkcatcount\"> (12)<\/span><\/option>\n\t<option value=\"#css-related\">CSS Related<span class=\"linkcatcount\"> (18)<\/span><\/option>\n\t<option value=\"#font-related\">Font Related<span class=\"linkcatcount\"> (4)<\/span><\/option>\n\t<option value=\"#general\">General<span class=\"linkcatcount\"> (8)<\/span><\/option>\n\t<option value=\"#html-related\">HTML Related<span class=\"linkcatcount\"> (10)<\/span><\/option>\n\t<option value=\"#image-related\">Image Related<span class=\"linkcatcount\"> (25)<\/span><\/option>\n\t<option value=\"#js-related\">JS related<span class=\"linkcatcount\"> (4)<\/span><\/option>\n\t<option value=\"#places-to-learn\">Places to Learn<span class=\"linkcatcount\"> (12)<\/span><\/option>\n\t<option value=\"#security-related\">Security Related<span class=\"linkcatcount\"> (2)<\/span><\/option>\n\t<option value=\"#text-related\">Text Related<span class=\"linkcatcount\"> (4)<\/span><\/option>\n\t<option value=\"#website-analytics\">Website Analytics<span class=\"linkcatcount\"> (5)<\/span><\/option>\n\t<option value=\"#wordpress\">WordPress<span class=\"linkcatcount\"> (3)<\/span><\/option>\n<\/select>\n<\/form><\/div>\n<script TYPE='text\/javascript'>\n\tfunction showcategory( catidvar ){\n\t\tlocation=\ndocument.catselect.catdropdown1.options[document.catselect.catdropdown1.selectedIndex].value }\n<\/script>\n\n<div style='clear:both' \/>\n\n<!-- End of Link Library Categories Output -->\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>A growing list of resources that I like and use: Tools and inspiration for making websites. and counting<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-649","page","type-page","status-publish","hentry","infinite-scroll-item"],"_links":{"self":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/pages\/649","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/comments?post=649"}],"version-history":[{"count":0,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/pages\/649\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/media?parent=649"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}