I want to create website wireframes.

Locally/offline, or on my own server.


  1. License:
    • The tool needs to be FLOSS
    • The included graphics need to be licensed under the same license, or under a different free content license (which doesn’t require attribution when publishing wireframes)
  2. OS:
    • Needs to be available for GNU/Linux
  3. Features:
    • Export the wireframe as graphic (e.g., PNG)

Nice to have

  • The exported wireframe should not include a watermark or something like that
  • Included in a GNU/Linux distribution’s repository
  • Availability for other OS (Unix-like, Microsoft Windows)
  • Ability to import new graphic sets

Update: The original tool seems to be no longer in development (last release from 2013-09). @wb9688 mentioned that there’s a fork: https://github.com/prikhi/pencil

Update 2: @nradk commented that the fork is no longer maintained. https://github.com/evolus/pencil is another fork, "in active development, and it is actually a rewrite of the old one".

Pencil (License: GPLv2) is a "GUI prototyping tool" which is available as

  • a stand-alone tool for GNU/Linux (*), Microsoft Windows, and Mac OS X, and
  • a Firefox add-on (**).

(*) It’s included in the software repositories of Arch Linux and Fedora (as pencil).

(**) The Firefox add-on hosted by Mozilla seems to be out of date (currently it’s version 1.0.6 from 2009), while the version hosted on Pencil’s download page seems to be the current one (currently version 2.0.5 from 2013).

I use Pencil as Firefox add-on. It opens a new window (with no Firefox chrome, it got its own menu bar etc). Sometimes, it gets kind of slow (e.g., when I rearrange graphics), but here my old PC might be to blame.

The graphics are called "Shape Collections" or "stencils". It ships with a few sets for different interfaces (including Web). Additional graphics can be imported. Here’s a sample wireframe I made to get an idea of some of the included graphics:

Example webpage wireframe, using Pencil’s "Sketchy GUI" graphics

Export of wireframes is possible as PNG, HTML, PDF, SVG, and ODT. A nice thing about the HTML ("Single web page") export is that you can add hyperlinks that link to other mock-ups (included in the same Pencil document), i.e., you can simulate user interactions.

  • 2
    Frankly I have the latest Pencil 2.0.5 on my Debian and it's quite buggy. I never managed to get the HTML export to work. It just generates empty documents or such with part of what I actually have in Pencil. Mar 21 '15 at 17:29
  • 1
    Also mention this fork
    – wb9688
    Jan 3 '16 at 8:11
  • 1
    That fork too is no longer maintained. There is another one here in active development, and it is actually a rewrite of the old one.
    – nradk
    Jul 24 '18 at 14:25

While not primarily a wireframing tool, Inkscape tends to be used for wireframes and mockups in open-source circles--GNOME and elementary use it, for example. (Similarly, in the proprietary world, UX designers tend to use generic vector design tools like Sketch and Figma.)

If you're looking for components to start with, it'll depend on the platform you're designing for.

  • For GNOME and elementary, I recommend starting with the svgs from their design repositories (links above).
  • For web and mobile, you can find various open-source wireframe kits around the web. Inkscape can import AI files, but, unfortunately, many kits are Sketch-only. You may use the proprietary web app Figma to upload the Sketch file and then export it as an SVG for use in Inkscape.

Update Sep. 23:

There are two relatively new tools being developed as FOSS alternatives to Sketch/Figma (the current industry standards):

  • Penpot, which is a web application that can be self-hosted (and also offers a SaaS version).
  • Akira, a desktop Linux app that was designed for elementary OS, but can be installed on basically any Linux distro via Flatpak

Right now, both are in alpha. Penpot is farther along in terms of features and also has a bigger team behind it.


Perhaps you may consider the Mockplus for a while. It can help you to create brilliant prototypes/wireframes both for mobile phones and webs.

  • With it, you could export images (PNG & GIF)or htmls to your stakeholders to present your ideas and designs.
  • For the app project, you could even preview it on your smart phone by scanning the QR code generated by the project.
  • It supports both Windows and Mac.
  • The interactive design in Mockplus is fully visualized, that's WYSIWYG. With a simple drag-and-drop to build interactive prototypes effortlessly.It has several trigger command such as rotating, resizing, etc. As well as a set of pre-designed components, including pop-up panel, stack panel, scroll box, sliding drawer and image carousel, make you create fully interactions faster and easier.

enter image description here

  • 1
    This does not meet 2 of my 3 requirements, does it? It doesn’t seem to be free/libre software, and it doesn’t seem to be available for GNU/Linux.
    – unor
    Sep 2 '15 at 17:24
  • 1
    While, it has a version for free, actually! mockplus.com/download
    – Charles
    Sep 9 '15 at 2:55
  • @Charles the OP wants Free as in speech, not free as in beer. Although free is usually a result of Free.
    – ivanivan
    May 9 '18 at 12:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.