FreeToolkit 001

The anti-slop toolkit.

Ten free tools for texture, type, colour and motion, for work that feels made, not generated. Each one comes with a line on what we'd use it for.

  • 10 tools
  • All free to start
  • Checked November 2026
  • Nothing sponsored
  1. The Cosmos website

    01 · References

    Cosmos

    A calmer place to collect references than Pinterest. You can blur or hide images flagged as AI-generated.

    Use it for

    Mood boards with no slop in them.

  2. The Paper Shaders website

    02 · Shaders

    Paper Shaders

    Open-source, zero-dependency shaders: grain, dithering, fluted glass, paper texture. Drop them into React or plain JS.

    Use it for

    Real texture, not a stock overlay.

  3. The Dither it! website

    03 · Texture

    Dither it!

    Turns any image into a dithered, limited-palette graphic, right in the browser.

    Use it for

    Instant print feel on a flat photo.

  4. The fffuel website

    04 · Texture

    fffuel

    A shelf of free SVG generators: grain, noise, grunge texture, fluid gradients, blobs.

    Use it for

    Try gggrain and tttexture first.

  5. The Haikei website

    05 · Shapes

    Haikei

    Generates SVG waves, blobs and layered shapes you can tweak and export. Free, no sign-up.

    Use it for

    Backgrounds no one else has.

  6. The Fontshare website

    06 · Type

    Fontshare

    Free typefaces from Indian Type Foundry, including Satoshi and Clash Display.

    Use it for

    Better than defaulting to Inter.

  7. The Uncut website

    07 · Type

    Uncut

    A curated catalogue of free, contemporary typefaces from independent designers.

    Use it for

    Finding a face with character. Check each font's licence.

  8. The Fonts In Use website

    08 · Type

    Fonts In Use

    An independent archive of typography on real posters, books, brands and sites.

    Use it for

    Seeing a font in the wild before you pick it.

  9. The Realtime Colors website

    09 · Colour

    Realtime Colors

    Tests a palette and font pairing on a real page layout before you commit.

    Use it for

    Killing the 'looked fine in the swatch' problem.

  10. The Easing Wizard website

    10 · Motion

    Easing Wizard

    Design CSS easing curves visually, from bezier to spring, bounce and overshoot.

    Use it for

    Motion that feels physical, not default.

+More like this

New lists drop on Instagram first

Screenshots taken from each site in November 2026. Pricing and features change, so check before you build on one.

Made by Craefto

Want this kind of care on your brand?

We're a design and technology studio in Sydney. We make brand identities, websites and the systems behind them. If this is your taste, you'll like the rest of our work.