What is Pebble?

Pebble in brief

Pebble is the visual language of the smartwatch that began life on Kickstarter in 2012 and shipped to its first backers in 2013. Its screen was a reflective memory display that could show only two states, ink and paper, so everything on the wrist, and later on the company's website, inherited a hard-edged, one-bit sensibility: no anti-aliasing, no gradients, no soft glows, just squared-off shapes that either exist or do not.

The style Curio captures is the getpebble.com of 2013 and 2014. It is a plain white page with dark grey body copy and headings in a burnt orange, and set into that calm frame is a small, crisp black-and-white screen, shown as a product photograph or an illustrated watchface. A brighter case orange is held back for colour swatches and the purchase button, so that the one place the eye is invited to act is also the one place the palette raises its voice.

What makes the look memorable is the contrast between two worlds. Around the watch is ordinary, friendly web design for a consumer gadget; inside the watch is a deliberately primitive pixel world, built from chunky numerals, dithered tones that simulate grey from black and white dots, and icons drawn square by square. The style is at its best when it lets those two worlds sit side by side without apology.

See the Pebble design system

Where does Pebble come from?

Pebble was founded around Eric Migicovsky, a Canadian engineer who had been building watches that talked to phones before anyone had a market for them. When traditional venture funding proved hard to find, the project went to Kickstarter in 2012 and became one of the most famous crowdfunding campaigns of its era, raising a sum in the millions of dollars from a very large crowd of backers. That origin shaped the brand: it spoke like a team of enthusiasts talking to other enthusiasts, not like a corporation addressing a market.

The hardware constraints did most of the design work. A low-power memory display with no backlight in the ordinary sense meant the watch could run for days on a charge and remain readable in direct sunlight, but it could draw only black and white. Designers and the community that gathered around the platform turned that limit into a craft. Greys were faked with patterns of dots, numerals were built from thick blocks so they could be read at a glance, and every icon, from a Bluetooth symbol to a battery gauge, was drawn on a grid with the discipline of a type designer working on a tiny bitmap font.

The watchface hacking scene is as important to the style as the company itself. Because the platform was open to developers, thousands of amateur and professional designers published their own faces, and the best of them treated the small screen like a poster: bold numerals, a few lines, a joke or a reference, nothing wasted. This community is the reason the aesthetic belongs to a wider tradition of one-bit pixel art that stretches back through early handheld games and monochrome computers.

The marketing site of 2013 and 2014 translated that culture to the web. Rather than imitate the watch's pixels everywhere, it used them sparingly as a centrepiece, and surrounded them with restrained, readable page design. The company later went through a difficult commercial period and its assets were eventually acquired by a larger firm, but a community called the Rebble Alliance kept the services and the watchfaces alive, which is a large part of why the look still carries real affection and a small measure of nostalgia.

What defines the Pebble look?

See the Pebble design system

Who shaped Pebble?

How do you use Pebble today?

For slides, the cover is the place to be bold. Use a white ground, a heading in burnt orange and a single crisp black-and-white image or pixel illustration centred in the frame, then leave generous empty space around it. Content slides should keep to dark grey text on white, with short bulleted lines and one idea per slide. Keep the brighter orange for the single call-to-action or the one item you want the audience to remember.

For data slides, resist the temptation to introduce a rainbow. Charts work best in strict black and white, using dither-style hatching and solid fills to separate series, with orange used for only the one series that matters. Labels should be large and blocky, in the spirit of a watchface, so that a chart can be read across a room in a single glance.

For web interfaces such as dashboards and pricing pages, the style suits hardware product pages, developer documentation and any tool aimed at enthusiasts. A pricing page can present each tier as a plain white card with an orange heading and a hard-edged border, with the purchase button in the brighter orange. Dashboards benefit from large numerals, square status indicators and a refusal to use soft shadows, which makes them feel fast and reliable.

For editorial and marketing work, let the one-bit pixel image carry the story. A launch announcement, a retro-themed newsletter or a documentation landing page can use a single pixel illustration as its hero, surrounded by calm, readable text. The tone of the writing should match: specific, friendly, a little nerdy, and quick to mention the clever details.

The most common mistake is to apply the pixel look everywhere, so that body copy, buttons and backgrounds all become bitmap. The style works because the pixel world is contained inside a calm, ordinary page. A second mistake is to add greys, gradients or soft shadows to the watch image, which destroys the one-bit logic that gives the look its identity. Keep the pixels in the screen, the clarity on the page, and the bright orange for the moment of choice.

See the Pebble design system

Pebble — FAQ