× Search About Posts Code Music Links
Blank Try
experiment
lots
learn
more

Links

Hugo

  1. Hugo Official site
  2. The New Dynamic great selection of articles and Hugo freebies.
  3. Regis Philibert: From Wordpress to a mindset transition
  4. Hugo Codex has some good ‘add ons’ such as breadcrumb nav, sliders, galleries and even chat functionality.
  5. Cusdis comment app is a free, open source Disqus alternative.
  6. Hugo Cheatsheet - nice list of useful code snippets for Hugo.
  7. Budd Parr’s mega list of Hugo articles

Colour

  1. Colour harmonies is a good and simple guide to ways of mixing colours.
  2. mycolor.space Quickly generates colour schemes from one colour.
  3. color.adobe.com online tool has lots of options for creating colour schemes.

SVG

  1. SVGator free online SVG editor but only for 3 exports pcm.
  2. SVGO is a command line SVG compressor tool.
  3. SVGOMG is a great web app version of SVGO with a list of button options so you can see your code by enabling and disabling the many options. (uncheck remove unused defs and clean IDs for sprites)
  4. Sara Soueidan’s blog an expert on all things SVG
  5. SVG Sprites drag’n’drop your SVG’s to have them made into a sprite.

Markdown

  1. HTML to Markdown converter at Code Beautify
  2. Markdown, a recap has lots of advanced Markdown practices but starting from basic stuff.

Other stuff

  1. Emoji Cheatsheet🐷
  2. Best free resources by Yes, I’m a Designer
  3. Alt and Unicode codes
  4. DuckDuckGo list of HTML characters
  5. How to Favicon in 2021

Icons

So I prefer SVG sprites and some Icon sites allow downloading a selection of icons as a sprite which is the best way to go. (See the Creative Bloq guide)

  1. IconFinder has a big somewhat random selection of icons. These are free without any issues. Download the SVG or copy the code to the clipboard. You’ll probably want to tidy up the code before using as there’s quite a bit of unnecessary code in them.
  2. Iconmnstr can download or just grab the code. Copy and pasting is good for creating SVG sprites. Need to disable adblockers to use.
  3. Fontastic.me excellent easy way to set up SVG sprites hosted on their CDN. See Cloud based icons.
  4. IcoMoon has 5500 free SVG icons. Launch the app, pick some icons then download the code and CSS. Can be downloaded as sprites.
  5. The Noun Project has a really great selection, though you need to sign up for an account first.
  6. Font Awesome has a complicated set up but easier to add icons using HTML italic tags like this: <i class="fab fa-adn"></i>.
  7. Heroicons has a nice set of non-corporate icons (no Twitter or Facebook for instance). One click on the icon to copy the SVG code makes it very easy to use.
  8. Zondicons another set of icons you can download in one foul swoop.
  9. Open Mojis open source emoji library.
  10. Icon Icons has a very comprehensive provided by different authors in ICO, ICNS, PNG and SVG formats.
  11. Fontello.com completely free, non commercial site to create custom icon font files inc. .woff2 and svg fonts.
  12. Icons8 the free tier has limits on format, low res only and requires a link to back to them.
  13. Flaticon can only download as PNG’s on the free tier.

Finally see Smashing Mag’s page on open source icons with a variety of subjects: weather, people, health, flags etc..

Inspiration

  1. Style Stage a modern CSS Zen Garden.
  2. Lapa Ninja landing page gallery
  3. CSS Nectar
  4. Dribbble designs and illustrations by the community.
  5. Code My UI
  6. Codrops has a regular selection of inspiring sites plus articles on cool effects.

Illustration

  1. Illustrators Lounge

See also the categories section

Dev blogs

Blogs about development

CSS

CSS resources and how to’s

Videos

A list of video channels worth watching

My Sites

a list of sites I made that are online currently