KDE Visual Design Group/HIG/Units

Purpose

This pages gives an overview about different units used in KDE and Plasma

Pixel

A (physical) pixel or dot is a physical point in a raster image, or the smallest addressable element in an all points addressable display device. Be careful not to confuse it with DPI independent pixels

DPI - pixels per inch

Pixel density is the number of (physical) pixels or dots that fit into an inch. Different screens have different DPI.

screen density = screen width (or height) in pixels / screen width (or height) in inches

DPI is often used interchangeably with PPI, pixel per inch.

PPI / DPI independent pixels

A DPI independet pixel is scaled to look uniform on any screen regardless of the DPI. A lot of platforms, eg iOS, Android, the Web, replaced the old (physical) px with a DPI px. So most the time you read about pixel/px they actually talk about DPI independent pixels. Qt (and QML) support DPI independent pixels in newer versions, but because KDE and Plasma support older versions of Qt too, one can not assume that pixels used in Qt or QML apps are DPI independent.

A rectangle defined with physical pixels and DPI independent pixels.

Note to developers: Except explicilty stated otherwise, all HIG pages, draft, mockups, ... pixels/px are always DPI independent pixels.

Fonts

Since KDE allows the user to change the font settings any dimensions defined with px, no matter if they are DPI independent or not, make problems together with text.

base units in plasma

There are two special base units in plasma:

• units.smallSpacing
• units.largeSpacing

These two are not only DPI independent but scale according to the font settings too.

A rectangle defined with units.smallSpacing