🎨

Design Tools

Interface design, motion, 3D and the asset libraries that keep a project moving: colour, type, photography and icons. Weighted toward tools with a real free tier.

17 tools Links out, nothing to install
  1. 1
    Figma Free tier · paid from about $16/mo per editor

    The industry default for interface design, and the collaboration is the reason rather than the drawing tools. Auto layout and variables are worth learning properly before you judge it.

    uicollaborationprototyping
  2. 2
    Penpot Free · open source · self-hostable

    The credible open source alternative to Figma, and it can run on your own servers. Slower and less refined; the only real option when design files cannot leave your infrastructure.

    uiopen-sourceself-hosted
  3. 3
    Canva Free tier · paid from about $15/mo

    Templates and stock assets that let a non-designer produce something acceptable quickly. Designers underrate how much it unblocks the rest of a company.

    templatesmarketingnon-designers
  4. 4
    Framer Free tier · paid from about $10/mo per site

    Design a marketing site on a canvas and publish it as a fast real website. Better motion than Webflow, less power once you need complex content structures.

    websitesmotionpublishing
  5. 5
    Webflow Free tier · paid from about $14/mo per site

    Visual development with a proper CMS behind it, which is why agencies build client sites here. It expects you to understand the box model, so it is not a drag and drop toy.

    websitescmsno-code
  6. 6
    Spline Free tier · paid from about $9/mo

    Browser-based 3D scenes you can embed in a web page without touching a shader. The easiest route from no 3D experience to something on a landing page.

    3dwebinteractive
  7. 7
    Blender Free · open source

    A complete 3D suite that competes with software costing thousands: modelling, sculpting, animation, simulation and video editing. The learning curve is the price you pay instead of money.

    3dopen-sourceanimation
  8. 8
    Rive Free tier · paid from about $14/mo

    Interactive animations with a state machine, so a single asset responds to what the user does. Far more capable than Lottie once an animation needs to react rather than replay.

    animationinteractiveruntime
  9. 9
    LottieFiles Free tier · paid plans

    Library, editor and player for Lottie animations, which stay small and sharp at any size. The standard way to ship vector motion into an app.

    animationassetsmobile
  10. 10
    Coolors Free tier · paid from about $3/mo

    Generate and lock palettes with the spacebar until something works, then export in every format you need. Check the contrast yourself, because a pretty palette can still fail accessibility.

    colorpalettesfree
  11. 11
    Google Fonts Free · open source licences

    Free type with licences that cover commercial work, self-hosting and app embedding. Popular choices are everywhere, so dig past the first page if you want distinctiveness.

    fontsfreeweb
  12. 12
    Fontshare Free for personal and commercial use

    Free professional typefaces from the Indian Type Foundry, with far more personality than the usual Google Fonts picks. A small library, curated rather than exhaustive.

    fontsfreequality
  13. 13
    Unsplash Free · paid plans for teams

    High quality free photography under a permissive licence. The house style is recognisable, so an Unsplash image can make a site look like every other site.

    photosfreestock
  14. 14

    Free photos and stock video with a broader and more ordinary range than Unsplash. Better when you need a picture of a real situation rather than an aesthetic.

    photosvideofree
  15. 15
    Heroicons Free · MIT licence

    A small, consistent icon set from the Tailwind team in outline and solid weights. Limited on purpose, which is why the set always looks coherent.

    iconsfreetailwind
  16. 16
    Phosphor Icons Free · MIT licence

    Thousands of icons in six weights, which is the reason to pick it over Heroicons when you need coverage. Ships for React, Vue, Flutter and plain SVG.

    iconsfreeweights
  17. 17
    Lucide Free · ISC licence

    The maintained fork of Feather icons, clean and stroke-based, with packages for every framework. The default choice in a lot of component libraries now.

    iconsfreeopen-source