Answer to: Why is my design blurry?

Short answer – unlike paper, display is a discrete medium.

Long answer, bellow.

When you prepare designs that will be printed, or when you are painting on paper, you usually do not have to care about some "pixel" grid. Thanks to the small size of dots when printing or the small size of paint particles when painting, you don't have to worry about fitting them in a grid, either because there is no grid at all or because the particles are much smaller than an eye could discern. On the other hand, displays have rather big grids, with resolution usually about 100 dpi, which means there are 100 particles per inch. You can easily imagine that with such small resolution, people with good eyes easily notice when something is not aligned to this grid, or isn't smoothed (we call it antialiasing).

For inkscape, cairo and other similar libraries and applications we can visualize the pixel grid like this:

The black lines represent coordinates used by cairo, inscape, ... while the squares inbetween are the actual pixels. Now imagine you'd like to draw a blue rectangle on (1,1) with width = 6 and height = 4. If you pass these numbers as its coordinates it will look like this:

This is fine, as the rectangle nicely fits into the grid. Such a rectangle would look crisp if displayed in 1:1

Now, if you decide to draw it with 1px wide border at the same coordinates with the same dimensions, how it will look like? Will the border be drawn outside the original rectangle or inside it? Neither is correct:

As you can probably guess, this will look blurry as the border ended up in between the pixels and thus is misaligned. You can correct this by shifting the position by 0.5px and making the dimensions smaller by twice the value:

If you now compare the two cases in original size, I think anyone can see (at least with the help of magnifier) the difference:


This work very similar for other shapes as well. It's important to bear in mind that the imaginary line in terms of coordinates marks the boundary of fills but the center of borders and that the grid lines are inbetween the pixels. You have to position your drawings appropriately in order to look crisp.

But what about fonts? See my previous post to see the main problem with them. Sadly inkscape does not offer better smoothing than greyscale for fonts, so you have to either use gimp, or align each letter manually (tedious).