Sign In



Open Menu

A collection of tools to help designers craft delightful experiences.

  • Sans Francisco Weekly
    New tools and links sent weekly.
  • 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.

    User Interviews

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

    Usability Hub

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


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


    UserBrain is a service that sends weekly videos of users using your app or website.


    Crowdtap is a platform for consumers to share their ideas, opinions, and stories with the brands they love.

    Narrative Clip

    Narrative Clip is a small wearable camera that easily clips onto clothing; ideal for participants willing to log a day in their life.


    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.

    What the Font

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

    Type Anything

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


    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.

    Fontface Ninja

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

    Modular Scale

    Modular Scale is a useful tool for exploring base and em ratio font relationships. is a tumblr-style source of inspiration for font combinations and layouts.

    Font Flame

    Font Flame is Tinder for fonts.


    Fontic scans your Photoshop files and outputs a list of all fonts used.


    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.


    RightFont is an app used to preview, sync, install, and manage fonts on your Mac.

    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.

    Type Sample

    Type Sample is a tool for identifying and sampling webfonts.

    CSS Sans

    CSS Sans is a sans serif font created entirely by CSS.


    Prototypo is a simple tool that allows you to adjust more than 30 attributes of a font.

    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.

    Flat UI Colors

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


    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.

    Color Farm

    Color Farm offers daily color palette inspiration curated from popular Dribbble shots.

    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.

    LOL Colors

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

    Color Snapper

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


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


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


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


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


    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.


    0to255 is a simple tool that helps web designers find variations of any color.

    Color Claim

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


    Drop is a color picker for MacOS that includes Touch Bar support.

    UI Gradients

    UI Gradients is a collection of beautiful color gradient pairs.

    HTML Color Codes

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


    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.


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


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

    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.

    Material Icons

    Material Icons is a catalog of icons used in the material design framework.


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

    Font Awesome

    Font Awesome is a collection of hundreds of icons that can be easily linked to in your CSS.

    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.

    The Stocks

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

    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.

    Diverse UI

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


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



    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.


    Panda is a new tab chrome extension to help you keep up to date with your favorite design and tech news sources.

    User Onboarding

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

    Collect UI

    Collect UI is a curated catalog of interface designs.

    UI Garage

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


    SiteSee is a curated gallery of modern websites.

    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.

    Really Good Emails

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


    Httpster is a catalog of web design trends and inspiration.

    UI Movement

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


    siteInspire is a simple wall of modern websites.


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


    Designspiration is a seemingly-random wall of creative projects.

    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.

    Empty States

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

    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.

    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.

    Brand New

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

    Designing for Good

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


    Logospire is an endless scroll of logos.

    Cognitive Lode

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

    Little Big Details

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

    Instant Logo Search

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


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


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

    Product Pages

    Product Page is a curated gallery of product landing pages.

    Brutalist Websites

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


    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.

    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.


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


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


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


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

    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.


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


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


    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.


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


    Build responsive HTML/CSS prototypes with real data — without writing a line of code.


    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.


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


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


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


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


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


    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.


    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.


    Origami (built by Facebook) is a new tool for designing and prototyping interfaces.

    CSS Reference

    CSS Reference is a visual library explaining the effect of various CSS properties.


    Form is a tool used to build an customize native mobile prototypes.


    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.


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

    Screenshot Builder

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

    Hero Patterns

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


    Scenery is a Mac app used to showcase your designs using premium mockup templates.


    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.

    Invision Tours

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


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


    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.

    Red Pen

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


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


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


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


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


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


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


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


    zipBoard allows teams to leave feedback by annotating websites.



    Inboard is a Mac app used to create a digital scrapbook of screenshots, images, and photos.


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


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


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


    Duco is an app that helps guide successful design sprints.


    Abstract is a version control tool that integrates with Sketch to help design teams stay up to date with each other's work.