A living hub of blogging resources, from early sparks to fine-tuning. Updated often with new good stuff. Anything missing? [Reach out](https://robertbirming.com/contact/). The library was last updated **2 days, 1 hour** ago. #### Menu --- ## Design Make it look good, feel calm, and stay fast. **๐Ÿ–ผ๏ธ Backgrounds** - [CSS3 Patterns Gallery](https://projects.verou.me/css3patterns/) - [CSS Background Patterns](https://www.magicpattern.design/tools/css-backgrounds) - [CSS flag generator](https://flag.isthe.link/) - [CSS mesh gradients](https://www.mshr.app/) - [Fancy Border Radius](https://9elements.github.io/fancy-border-radius/) โ€“ organic shape generator. - [Gradient Generator](https://www.joshwcomeau.com/gradient-generator/) - [Gradient Generator (CSS & SVG)](https://www.learnui.design/tools/gradient-generator.html) - [HDR Gradients](https://gradient.style/) โ€“ CSS gradient generator with color spaces. - [Hero Patterns](https://heropatterns.com/) - [Polka Dot Generator](https://screenspan.net/polka/) - [Repper Patterns](https://repper.app/patterns/) - [Shape Divider](https://www.shapedivider.app/) โ€“ responsive section divider generator. - [Shadow Gradients](https://alvarotrigo.com/shadow-gradients/) โ€“ CSS gradient shadow generator. - [Subtle Patterns](https://www.toptal.com/designers/subtlepatterns/) - [SVG Shape Dividers](https://www.svgbackgrounds.com/elements/svg-shape-dividers/) โ€“ customizable section dividers. - [Transparent Textures](https://www.transparenttextures.com/) โ€“ colorable transparent patterns. - [uiGradients](https://uigradients.com/) - [Code Corners](https://codecorners.rknight.me/) **๐ŸŽ›๏ธ Buttons** - [ButtonBuddy](https://buttonbuddy.dev/) - [CSS Buttons](https://cssbuttons.io/) - [cssbuttons.app](https://cssbuttons.app/) - [UI Buttons](https://ui-buttons.web.app/) **๐ŸŒˆ Colors** - [Adobe Color](https://color.adobe.com/) - [Base2Tone Colorschemes](https://base2t.one/) - [Clickart Color Reference](https://clickart.rknight.me/) - [Color Hunt](https://colorhunt.co/) - [Color Palettes](https://www.canva.com/colors/color-palettes/) - [CoolHue 2.0](https://webkul.github.io/coolhue/) - [Coolors](https://coolors.co/) - [Colourco](https://www.toptal.com/designers/colourcode) - [Endless Color Combos](https://randoma11y.com/) - [HTML named colors](https://frills.dev/experiments/html-named-colors/) - [The 12-bit rainbow palette](https://iamkate.com/data/12-bit-rainbow/) - [Shadow Palette Generator](https://www.joshwcomeau.com/shadow-palette/) - [Material Palette](https://materialpalette.com/) - [Material UI](https://materialui.co/) - [Mildliners](https://mildliners.rknight.me/) - [Pikr](https://getpikr.app/) โ€“ color picker with WCAG contrast checking. - [oklch.fyi](https://oklch.fyi/) โ€“ OKLCH color picker, generator, and converter. - [The Hydrant Directory](https://www.dayroselane.com/hydrants) - [Colorpeek](https://colorpeek.com/) - simply share colors **๐Ÿงฉ CSS** - [CSS Bed](https://www.cssbed.com/) - [CSS Icon Library](https://css.gg/) - [CSS Shapes](https://css-shape.com/) - [CSS-Tricks](https://css-tricks.com/) - [CSS Tutorial](https://www.w3schools.com/css/) - [CSS Validation Service](https://jigsaw.w3.org/css-validator/) - [CSS Stats](https://cssstats.com/) - [CSS Filter Generator](https://www.uisurgeon.com/tools/css-filter-generator) - [CSS Image Filters](https://baseline.is/tools/css-photo-filters/) - [Modern CSS Solutions](https://moderncss.dev/) - [Simple.css Framework](https://simplecss.org/) **๐Ÿ…ฐ๏ธ Fonts** - [Beautiful Web Type](https://beautifulwebtype.com/) - [Bunny Fonts](https://fonts.bunny.net/) - [Enfont Terrible](https://enfont.javierarce.com/) - [Font Awesome](https://fontawesome.com/) - [Fontfabric](https://www.fontfabric.com/fonts/) - [Font pairing made simple](https://fontjoy.com/) - [Font Pairings](https://fontpairings.bypeople.com/) - [Fontshare](https://www.fontshare.com/) - [Font Squirrel](https://www.fontsquirrel.com/) - [Fonts in Use](https://fontsinuse.com/) - [Google Fonts](https://fonts.google.com/) - [Mixfont](https://www.mixfont.com/) - [Modern Font Stacks](https://modernfontstacks.com/) - [Nerd Fonts](https://www.nerdfonts.com/) โ€“ patched fonts with icons and glyphs. - [Open Foundry](https://open-foundry.com/fonts) - [SimpleBits](https://simplebits.shop/collections/fonts) - [The League of Moveable Type](https://theleagueofmoveabletype.com/) - [Typespiration](https://typespiration.com/) **๐Ÿ“„ HTML** - [HTML *head* elements guide](https://htmlhead.dev/) - [HTML Recipes](https://htmlrecipes.dev/) - [Learn Web Development](https://developer.mozilla.org/en-US/docs/Learn) - [Markup Validation Service](https://validator.w3.org/) - [Plain Vanilla](https://plainvanillaweb.com/) - [Tiny Helpers](https://tiny-helpers.dev/) - [What is HTML?](https://www.w3schools.com/whatis/whatis_html.asp) - [HTML for People](https://htmlforpeople.com/) - [The HTML Hobbyist](https://www.htmlhobbyist.com/) **๐Ÿ”ฃ Icons & Symbols** - [Basicons](https://www.basicons.com/) โ€“ basic icons for product design. - [Flaticon](https://www.flaticon.com/) - [Font Awesome Icons](https://fontawesome.com/icons) - [Fontello](https://fontello.com/) - [Handcrafted and Lovely Icons](https://pathlove.com/icons/) - [Heroicons](https://heroicons.com/) - [HTML Symbols](https://www.toptal.com/designers/htmlarrows/) - [Iconfinder](https://www.iconfinder.com/) - [Ionicons](https://ionic.io/ionicons) - [Ligature Symbols](https://kudakurage.com/ligature_symbols/) - [Lordicon](https://lordicon.com/) โ€“ animated icons. - [Material Symbols & Icons](https://fonts.google.com/icons) - [Microns](https://www.s-ings.com/projects/microns-icon-font/) - [Octicons](https://primer.style/foundations/icons) - [Phosphor Icons](https://phosphoricons.com/) - [Simple Icons](https://simpleicons.org/) - [Softies](https://www.robbiepearce.com/softies/) - [Super Tiny Icons](https://github.com/edent/SuperTinyIcons) - [SVG Repo](https://www.svgrepo.com/) - [Tabler](https://tabler.io/icons) โ€“ free open source icons. - [Typicons](https://www.s-ings.com/typicons/) - [Icons 8](https://icons8.com/) **๐ŸŒŸ Inspiration** - [Awwwards](https://www.awwwards.com/websites/) - [CSS Design Awards](https://www.cssdesignawards.com/) - [Dead Simple Sites](https://deadsimplesites.com/) - [Httpster](https://httpster.net/) - [Inspirational Blog Designs](https://dribbble.com/search/blog) - [The Whimsical Web](https://whimsical.club/) **๐Ÿ”– Logos** - [Adobe Logo Maker](https://www.adobe.com/express/create/logo) - [Brandmark](https://brandmark.io/) - [Free Logo Design](https://www.freelogodesign.org/) - [Free Online Logo Maker](https://www.renderforest.com/logo-maker#All) - [LogoAI](https://www.logoai.com/logo-maker) - [Looka Logo Maker](https://looka.com/logo-maker/) - [Logo Maker by Design.com](https://www.design.com/logo-maker) - [The Ultimate AI Logo Maker](https://logo.com/) **๐Ÿ“ท Photos** - [Freerange](https://freerangestock.com/) - [ISO Republic](https://isorepublic.com/) - [Pexels](https://www.pexels.com/) - [Picjumbo](https://picjumbo.com/) - [Picography](https://picography.co/) - [Pixabay](https://pixabay.com/photos/) - [Unsplash](https://unsplash.com/s/photos/blog) **๐Ÿงฐ Tools & Guides** - [Adding meta tags, manifest, and favicons](https://custom.themes.lol/2024/03/adding-meta-tags-manifest-favicons) - [Check your meta tags, icons, and rss feeds](https://lens.rknight.me/) - [Components AI](https://components.ai/) - [Keep a changelog](https://keepachangelog.com/en/1.1.0/) - [Know it all](https://know-it-all.io/) **๐ŸŽฌ Videos** - [Coverr](https://coverr.co/) - [Free Stock Video](https://free-stock.video/) - [Mazwai](https://mazwai.com/) - [Mixkit](https://mixkit.co/free-stock-video/) - [Pexels](https://www.pexels.com/videos/) - [Pixabay](https://pixabay.com/videos/) - [Videezy](https://www.videezy.com/) - [Vidsplay](https://www.vidsplay.com/) --- ## Accessibility Build a blog more people can enjoy. - [Accessibility Support](https://a11ysupport.io/) - [Contrast Checker](https://webaim.org/resources/contrastchecker/) - [How to make your blog accessible to blind readers](https://afb.org/consulting/afb-accessibility-resources/how-make-your-blog-accessible) - [Introduction to Web Accessibility](https://www.w3.org/WAI/fundamentals/accessibility-intro/) - [Link Contrast Checker](https://webaim.org/resources/linkcontrastchecker/) - [Colorable](https://colorable.jxnblk.com/) โ€“ color contrast tester. - [Principles Of Web Accessibility](https://github.com/Heydon/principles-of-web-accessibility?tab=readme-ov-file#principles-of-web-accessibility) - [Readability Analyzer](https://datayze.com/readability-analyzer) โ€“ in-depth readability scoring. - [Readability Test](https://www.webfx.com/tools/read-able/) - [Usability & Web Accessibility](https://usability.yale.edu/web-accessibility/articles/links) - [Using the language attribute to make your website accessible](https://www.craigabbott.co.uk/blog/using-the-language-attribute-to-make-your-website-accessible/) - [Web Accessibility Checklist](https://blog.hubspot.com/website/web-accessibility-guidelines) - [WhoCanUse โ€” color contrast checker](https://www.whocanuse.com/) - [Write helpful Alt Text to describe images](https://accessibility.huit.harvard.edu/describe-content-images) --- ## Optimization Handy tools to keep your site quick and tidy. - [Bookmarklets for testing your website](https://adactio.com/journal/20965) - [PageSpeed Insights](https://pagespeed.web.dev/) - [JS & CSS Minifier](https://www.websiteplanet.com/webtools/jscssminifier/) - [Image Compression](https://tinypng.com/) - [Website Carbon Calculator](https://www.websitecarbon.com/) --- ## Add-ons Small tools that add big things to your blog. - [Komments](https://komments.cloud/) โ€“ add comments to your blog. - [Letterbird](https://letterbird.co/) โ€“ free contact form. - [Tinylytics](https://tinylytics.app/) โ€“ a joyful analytics tool. - [Buttondown](https://buttondown.email/) โ€“ create a newsletter. - [Guestbooks by Meadow](https://guestbooks.meadowing.club/) โ€“ free and simple guestbook. - [Guestbooks by Kami](https://guestbooks.kamiscorner.xyz/) โ€“ Bear Blog-inspired guestbook app. - [Tally](https://tally.so/) โ€“ simple way to create forms. - [PrintFriendly](https://www.printfriendly.com/button) โ€“ print button for your blog. - [status.lol](https://status.lol/) ยท [shoutouts.lol](https://shoutouts.lol/) โ€“ status and shoutouts. - [Miniroll](https://www.miniroll.app/) โ€“ create and embed your blogroll. - [Miniship](https://www.miniship.app/) โ€“ create and embed a changelog. --- ## Discover Read more blogs, find new favorites. - [A Blog Directory](https://blogroll.bearblog.dev/) - [Blogroll](https://blogroll.org/) โ€“ curated list of personal blogs. - [Feedle](https://feedle.world/) โ€“ a blog search engine. - [ooh.directory](https://ooh.directory/) โ€“ a place to find good blogs. - [PersonalSit.es](https://personalsit.es/) โ€“ hot and fresh sites. - Bear Blog: [Trending](https://bearblog.dev/discover/) ยท [Recent](https://bearblog.dev/discover/?newest=true) - Scribbles: [Blogs](https://scribbles.page/explore/blogs) ยท [Posts](https://scribbles.page/explore) - [Micro.blog Discover](https://micro.blog/discover) - [IndieBlog.page](https://indieblog.page/) - [Search My Site](https://searchmysite.net/) - [About Ideas Now](https://aboutideasnow.com/) - [A list of /now pages](https://nownownow.com/) - [A list of /uses pages](https://uses.tech/) - [Indieseek Weblog Directory](https://indieseek.xyz/links/personalpages/weblogs/) - [Blog of the Day](https://blogofthe.day/) - [Minifeed](https://minifeed.net/) - [RSS Club](https://daverupert.com/rss-club/) - [Bukmark Club](https://bukmark.club/) - [Blogs Are Back](https://www.blogsareback.com/) โ€“ discover and follow independent blogs. - [Smallweb](https://smallweb.cc/) - a curated collection of neat indie websites. - [powRSS](https://powrss.com/) - [Kagi Small Web](https://kagi.com/smallweb) --- ## Ideas Lists and prompts to kick things back into motion. - [Daily prompts](https://kmcd.dev/prompts/) - [50 ideas for blog posts](https://louplummer.lol/50-ideas-for-blog-posts/) - [100 things you can do on your personal website](https://jamesg.blog/2024/02/19/personal-website-ideas/) - [100 (more) things you can do with your personal website](https://jamesg.blog/2024/03/10/100-more-personal-website-ideas/) - [What to blog about when you don't know what to blog about](https://css-irl.info/what-to-blog-about-when-you-dont-know-what-to-blog-about) - [100 blog post topics to write about](https://discombobulated.co.nz/100) - [Blog Prompts](https://blogprompts.fyi/) - [BlogBuddy](https://robertbirming.com/blogbuddy/) --- ## Resources Useful things that didn't fit anywhere else. - [Echo](https://echo.rknight.me/) โ€“ RSS cross poster. - [Markdown Guide](https://www.markdownguide.org/) - [Own your web](https://buttondown.email/ownyourweb) - [People and blogs](https://peopleandblogs.com/) - [Slash pages](https://slashpages.net/) - [Subscribe Openly](https://subscribeopenly.net/) - [List of blog platforms](https://manuelmoreale.com/blog-platforms) - [A collection of Bear blog resources](https://grizzlygazette.bearblog.dev/bearblog-resource-list/) --- ## Webrings Small networks of sites that link to each other. - [An IndieWeb Webring](https://xn--sr8hvo.ws/) - [A Webring List](https://brisray.com/web/webring-list.htm) - [Bucket Webring](https://webring.bucketfish.me/) - [Hotline Webring](https://hotlinewebring.club/) - [Retronaut](https://webring.dinhe.net/) - [Fediring](https://fediring.net/) - [Geekring](https://geekring.net/) - [The Safonts Webring](https://xandra.cc/safonts/members) - [The Old Net](https://webring.theoldnet.com/) - [XXIIVV](https://webring.xxiivv.com/) - [CSS Joy](https://cs.sjoy.lol/) - [a11y-webring.club](https://a11y-webring.club/) - [Wayward Web](https://waywardweb.org/) - [Rootring](https://rootr.ing/) - [Bear random](https://robertbirming.com/bear-webring-buttons/)