Sign In



Open Menu

A collection of tools to help designers craft delightful experiences.

  • Sans Francisco Weekly
    New tools and links sent weekly.
  • Avocode


    Share Photoshop or Sketch designs with your team and convert them to code. On Mac, Windows and Linux.

    User Research


    Typeform is an elegant, feature-rich survey tool.


    Cassette is a digital logbook to help you "record, transcribe, and bookmark key moments in user interviews."

    Optimal Workshop

    Optimal Workshop offers a suite of UX tools that help improve your website navigation, define information architecture, understand first-clicks, run surveys and capture qualitative research.


    Testmate is a tool that saves you and your team time by automating the logistics of user research interviews.


    Doopoll is a poll tool to help you gather quick feedback from users.


    UserTesting allows you to recruit users and run remove, video-recorded usability tests.


    Lookback allows you to run user tests while remotely recording the screen, the user's face and voice, and their in-app interactions.


    TestingTime makes user tests easier to run by helping with recruitment, scheduling, payment, and more.

    UX Check

    UX Check is a Chrome extension that checks for elements on a website that break any of Jakob Nielson's Ten Heuristics. is a screensharing, note taking, and recording tool to help you run remote user research.


    Sprint is a lightweight tool to help you get quick feedback on a new prototype, app, or website. Use code "SansFrancisco" for a free 10-person test ($250 value).


    FullStory lets you easily record, replay, search, and analyze each user's actual experience with your website.

    Usability Hub

    Usability Hub allows you to run simple user tests to get quick data on a design.

    User Interviews

    User Interviews helps you screen and recruit users for any sort of qualitative research exercise.


    Ethnio intercepts users visiting your site or app and allows them to schedule an interview with you!


    Dovetail helps collect user insights by sending simple, contextual questions via SMS or email.


    Google Fonts

    Google Fonts is a safe bet when shopping for project fonts. Download font families to use in design files or grab scripts to toss into your code.


    If you have an Adobe CC license, TypeKit offers access to a whole bunch of premium fonts.

    Font Squirrel

    Font Squirrel offers a database of all the free fonts your little heart could possibly desire.

    Type Nugget

    Type Nugget is a WYSIWYG editor for web typography CSS.

    Type Anything

    Type Anything lets you fine tune your family of header styles, and then download the CSS to get your design live.

    What the Font

    What the Font helps you identify a mystery font by scanning a file that have so generously uploaded.


    Typewolf offers a daily bit of typography-in-the-wild inspiration.


    Typecast allows you to prototype site typography and then download the CSS to make it happen.

    Modular Scale

    Modular Scale is a useful tool for exploring base and em ratio font relationships.

    Fontface Ninja

    Fontface Ninja is a browser extension that helps you identify fonts while browsing a website.


    Fontic scans your Photoshop files and outputs a list of all fonts used. is a tumblr-style source of inspiration for font combinations and layouts.

    Font Flame

    Font Flame is Tinder for fonts.


    After entering a font of your choice, FontReach scans the interwebz to show you sites that use that font. It's like the zoo for designers.

    Fonts In Use

    Fonts In Use is an archive showing how various fonts have been applied in a full variety of design applications.

    Type Detail


    Wenting Zhang annotates the details of a few dozen common typefaces.

    Font Pair


    Font Pair is a curated collection of heading/body pairs of Google Fonts.

    Color Palette

    Color Hunt

    Color Hunt is Pinterest for colors. Scroll, scroll, scroll through four color combinations.


    Sip is a Mac and iOS app to help you grab colors and create palettes.


    Coolors allows you to toggle through and save sexy color palettes.

    Adobe Kuler

    Kuler is a compass for the color wheel. Use it to explore combinations of analogous, monochromatic, and all sorts of combinations.

    Flat UI Colors

    Flat UI Colors offers click and copy access to twenty vibrant flat colors.

    Material Colors

    If you subscribe to Google's Material Design methods, Material Colors offers quick access to color choices.


    Palettable is an interactive tool for building up a color palette, one color at at time.

    Color Snapper

    Color Snapper is a MacOS app that allows you to quickly grab the hex code of a color you stumble upon.

    LOL Colors

    LOL Colors is a minimalist's inspiration wall of color palettes.


    Unclrd is a chrome plugin that converts websites to black and white.


    Color Drop offers a wall of four color sets for you to browse through and save.


    Colicious is a simple tool that generates a random color at the tap of the space bar.


    Colorable is a quick tool to assess the accessibility of a color pair (background and text color).


    ColorCubo allows you to create and store color palettes in a simple dashboard.

    Material Palette

    Material Palette helps you generate a material UI color palette.

    HTML Color Codes

    HTML Color Codes offers a color picker and simple tutorials to teach you the basics of color theory and css/scss.

    Color Claim

    Color Claim is a modest collection of color pairs curated by Toby Van Schneider.


    The Noun Project

    The Noun Project is a massive searchable database of icons created by a community of designers. Pay for a membership or give credit to the designer.


    illustrio offers a massive searchable database of all sorts of icons.


    Iconjar makes it easy to store, organize, and search through all of your icons. No more scanning through a wall of icons, row by row.

    Flat Icon

    Flat Icon is a large icon database featuring work from a community of designers.


    Entypo is a set of 400+ icons that cover the 80/20 of just about any project.


    Iconfinder is a large, searchable database of icons.


    Nucleo offers 8000+ searchable, customizable icons, with new icons being added every week.


    to[icon] offers a bunch of free bundles of icons.

    Icon Store

    Icon Store offers free downloadable kits of icons.


    Symbolset offers several bundles of icons and a semantic Unicode approach to calling those symbols.


    Webalys offers several large sets of icons, including Streamline iOS and Material icons.

    CSS Icon


    CSS Icon is a library of icons drawn with nothing but CSS.

    Stock Photos


    Unsplash is a database of beautiful, high-res, free photos for creative use. No awkward office stock photos. Make sure you give credit to the photographer.


    Pexels is a large pool of all sorts of free stock photos for creative uses.

    Death to the Stock Photo

    Death to Stock is another reaction to trashditional stock photography. Join their mailing list to get new photos every month, or get a membership to access their full archives.


    Zoommy is a desktop app to help you search through stock photos from over 40 sources.


    PicJumbo offers free stock photos, as well as a premium membership to access a larger library.

    Diverse UI

    Diverse UI is a stock photo collection that will help you represent a diverse group of people in your mockups.

    The Stocks

    The Stocks is a collection of free stock photos from a number of sources.



    Born out of Salem, MA, Dribbble has grown to become a hub for designers to share their work, meet other designers, and get inspired.


    Muzli is a curated gallery of all sorts of design inspiration.


    Behance is a great spot to build up and display a design portfolio and find inspiration from other designers.


    Awwwards are awards for 'design, creativity, and innovation for the internet.'


    Pttrns is a catalog showing how well-known apps have tackled various UX flows and elements.

    User Onboarding

    User Onboarding creates incredibly detailed walkthrough slideshows that show the onboarding flow of well-known web and mobile apps.

    UI Garage

    UI Garage is a catalog showing how well-known apps handle various app flows and elements.

    Mobile Patterns

    Mobile Patterns is a catalog showing how well-known apps have tackled various UX flows and elements.

    Land Book

    Land Book is a large gallery of product landing pages.


    SiteSee is a curated gallery of modern websites.


    Httpster is a catalog of web design trends and inspiration.

    Really Good Emails

    Really Good Emails is a site dedicated to showcasing beautifully designed emails.

    UI Movement

    UI Movement is an endless feed of gifs to inspire web and mobile animations.

    Empty States

    Empty States is a site devoted to showcasing website and mobile app empty states.


    Designspiration is a seemingly-random wall of creative projects.


    Lapa is a site dedicated to showcasing landing pages for websites in a range of categories.

    UX Archive

    UX archive is a catalog showing how well-known apps handle various design flows and elements.


    Uplabs is a community for designers to share and sell their work.


    siteInspire is a simple wall of modern websites.

    UI Interactions

    UI Interactions is a catalog of mobile interaction designs from existing apps.


    Craftwork is a database of over 500 free UI assets: icons, fonts, and UI kits.

    Designing for Good

    Designing for Good is a collection of non-profit designs from around the world.

    Nice Portfolio

    Nice Portfolio is a curated showcase of designer portfolio sites.

    UX Timeline

    UX Timeline is a time capsule for websites. Flip through and see how your favorite sites have evolved over time.

    Cognitive Lode

    Cognitive Lode distills behavioural economics and consumer psychology research into small, bite-sized pieces.

    Brand New

    Brand New is a blog that reviews branding and logo changes made by well-known companies.


    Logospire is an endless scroll of logos.

    Product Pages

    Product Page is a curated gallery of product landing pages.


    Chindogu is a Japanese art of inventing objects that are offer an obvious benefit while simultaneously introducing more problems and social embarrassment.

    Brutalist Websites

    Brutalist Websites is a catalog of sites following brutalist principles, offering some anti-inspiration.

    Instant Logo Search

    Instant Logo Search lets you search for and download (png & svg) the logos of well-known brands.


    FourZeroFour is a site dedicated to showcasing creative 404 error pages.

    Little Big Details

    Little Big Details is a blog the highlights the small, often overlooked design elements that make up great digital experiences.


    LandingFolio is a site dedicated to showcasing landing pages for websites in a range of categories.

    Motion Periodic Table

    The Motion Periodic Table is a quick reference for web animations.

    UI Movement

    UI Movement is a curated collection of UI animations.



    Sketch is a lightweight tool to help you assemble your designs.


    Once you've sketched up a series of screens, toss them into Invision to built a clickable, interactive prototype.


    Craft is a Sketch plugin that makes it stupidly easy to populate your designs with real content. No more lorem ipsum.


    Framer takes a dual code/visual approach to building prototypes for web and mobile.

    Mirror for Sketch

    If you're designing mobile apps with Sketch, then Mirror is a must. It allows you to sync your design files right to your phone for live updates.


    Principle is the Sketch of animations. Drop objects in and quickly begin to experiment with animations.


    Marvel is a lightweight tool to create designs, stitch together interactive prototypes, and get feedback from your co-conspirators.


    ProtoIO is a high-fidelity prototyping tool that allows you to create rich, animated, interactive prototypes.

    Adobe Photoshop

    Photoshop is a beast of a tool; you can use it to create just about any static image you can imagine.


    Atomic is a tool to help you prototype web and mobile interactions.


    ProtoPie is a code-free tool for prototyping interaction designs.

    Adobe Illustrator

    Illustrator is Adobe's specialty vector tool. Use it to create logos, icons, or complex illustrations.


    Axure allows you to sketch up interfaces and collaborate with stakeholders.


    Flinto allows you to turn a series of static design images into a rich, clickable prototype.


    Balsamiq is a quick tool used for building and testing wireframes of web and mobile apps.

    Adobe Experience Design

    Adobe Experience Design is used to mockup rough interfaces and interactive prototypes.


    Webflow is a CMS for quick and easy responsive websites.


    Figma is a powerful, intuitive interface design tool that allows for real-time collaboration.

    Tumult Hype

    Tumult is a prototyping tool for web interactions and animations.


    Pixate allows you to create high fidelity clickable prototypes to test app interactions and animations.


    Origami is a Facebook design tool to help you prototype and present mobile animations.


    Quant-UX is a prototyping tool that includes a suite of visual analytics to help you better understand how users use the prototypes.


    JustInMind is a Mac app used to create interactive wireframes for web and mobile experiences.


    Floid is a Mac app for prototyping web and mobile interactions.


    Pattern is a simple drawing app that makes it easy to mock up wireframes on your iPad.


    Napkin is an iOS app that allows you to mock up an app prototype right on your phone.


    POP allows you to take photos of physical sketches and turn them into rough interactive prototypes.


    SneakPeekIt is a collection of printable grids for web and mobile design wireframing.


    Subform is a new interface design tool (currently on Kickstarter) with a focus on outsourcing the burden of responsive layouts and consistent styles to the software.


    Sketchpacks is a catalog of popular plugins for Sketch.


    Prott allows you to create clickable prototypes out of simple wireframes and paper prototype photos.



    Reflector allows you to connect your phone to your computer to record in-app videos.

    Smart Mockups

    Smart Mockups offers a range of scenes for you to drop web and mobile designs into.


    Placeit allows you to create still and video device mockups for a range of devices.

    Screenshot Builder

    Screenshot Builder makes it easy to generate App Store screenshots in all device sizes.


    Mockuuups is a marketplace for device images to present your web, mobile, or wearable designs.

    Hero Patterns

    Hero Patterns is a collection of repeatable SVG background patterns for you to use on your digital projects.


    Semplice is a designer-centric tool for creating and showcasing your portfolio.



    Wake is a collaboration tool to help design teams share ideas and give feedback.


    Zeplin allows designers to automatically create style guides and resources, making the transition to engineering easier.

    Invision Boards

    Invision Boards is a simple tool for creating and presenting mood and brand boards.


    Sympli generates style guides, specs, and assets for design handoff and helps automate implementation for developers.


    Lingo is like Dropbox for design teams. The MacOS app allows teams to easily store and share visuals.



    Share Photoshop or Sketch designs with your team and convert them to code. On Mac, Windows and Linux.

    Invision Tours

    Add annotations to your designs to walk coworkers and clients through asynchronously.


    Webscope allows teams to comment on web features directly on the site page.


    Samepage allows teams to discuss and spec out new projects.


    Frontify is used to create and share brand and UI libraries between team members.


    Mural allows teams to remotely run brainstorms, organize their ideas, create mindmaps, and more.


    Opentest is a Chrome plugin that enables quick and easy screen, mic, and front-camera recordings.


    Notion is a Mac app that helps teams organize docs, wikis, and tasks from various tools in one central place.


    Recordit is a MacOS app that makes it easy to record and share video screenshots.

    Red Pen

    Red Pen helps teams quickly markup and comment on visual designs.


    Yossarian uses AI to help boost your creativity during mind mapping exercises.


    UXPin is a shared workspace for teams to design and prototype together.


    Fuse helps transition designs to live applications with a visual coding tool that improves collaboration between designers and developers.


    Mockflow offers a suite of tools for design and development teams to communicate ideas.


    zipBoard allows teams to leave feedback by annotating websites.


    Trello is a useful tool to help design teams prioritize and manage their pipeline of work.


    Inboard is a Mac app that lets teams organize screenshots, images, and photos into a searchable scrapbook.


    Canvas is a WYSIWYG note editor that allows teams to share notes and spec out projects in real time.



    Sococo is a virtual office and conference room helping remote teams collaborate easier.