The Bilbee brand

Bilbee is invoicing, expenses and tax for Australian sole traders. It turns your records into a running estimate of the year's tax, and a Simpler BAS worksheet if you're registered for GST. The estimate moves as you get paid, so you know roughly where you stand all year, not only once it's over.

Keep clear space of at least half the mascot disc’s height on every side. The lockup is at least 24 px tall on screen. For larger placements, give it more room rather than making it fill the frame.

The logo is artwork, not typeset text. Don’t rebuild it with a font. On lime, use the supplied mascot and wordmark as separate elements.

Give text plenty of contrast: ink on paper, ink on lime, white on forest. Use the wider palette to explain a status or a chart, rather than adding decoration.

A status always has a word as well as a colour. Lime is an accent, never body text on white.

P22 Mackinac Pro Book is for page and section headings. P22 Medium gives feature headings their shape. Illustration titles use P22 Medium at 24 px and −0.04em letter spacing. FF Real Headline Pro at weight 300 carries body copy, figures and supporting titles. Supporting titles are 24 px, or 20 px in compact cards, with −0.02em letter spacing. Weight 400 is for navigation, controls and emphasis. Both families use supplied font cuts, with browser-generated weight disabled. Page headings use 40–80 px with 0.95 line height and −0.035em letter spacing. Section headings use 30–56 px with 1.0 line height and −0.04em letter spacing. Keep long passages left aligned and let headings wrap at natural phrases.

Use Australian formats: $1,240.50, 14 Aug 2026 and FY 2026–27. The web app uses Geist for its interface. Keep that distinction when showing real product screens.

Font files are not included in the kit. Use your own appropriate font licence for new work.

Bilbee is our main character. The tradie, designer, developer and cleaner bring their own colour, expression, hair, ears and working kit. Choose the person who belongs in the story.

Keep their felt texture, proportions and supplied colours intact. Expressions can change with the moment. They don’t always need to wink.

Point towards an explanation. Wave in a welcome. Use the tools when the story is about the work. Save a celebration for something that has actually happened.

A horizontal flip can help a character face the content. Check any writing or directional props first, and remember that ears, hair and accessories will also swap sides. Keep the logo in its original direction.

The character stays tactile and felt. The setting is flatter: risograph grain, simple shapes and familiar lilac, apricot, sage and cream. It gives the work a place to happen.

Use the transparent edges to blend gently into a quiet surface. Keep the full composition visible, with room around it. Avoid hard crops, extra shadows or a scene behind body copy.

These are five scene options for the website stories shown above. A scene replaces the page’s existing character moment. Product previews still explain the product.

An envelope, a folder, a notebook. Familiar objects make an empty space feel ready for the next step. This is the default app illustration family.

Use the familiar palette and soft risograph texture. Keep the headline, explanation and buttons as real interface elements beneath the art.

These two Bilbee variants are for a deliberate welcome moment. Use one when a little company helps, with object-led illustrations doing the everyday work elsewhere.

Lucide icons, with a consistent 2 px stroke. Use 16 px in compact rows, 18–20 px in buttons and larger sizes when there is room. Always pair an unfamiliar symbol with a label.

Keep related things close and give new ideas a little room. Use the shared 4 px spacing grid. Keep content surfaces softly squared and controls rounded.

Shadows are subtle and tinted with ink. Hover states darken. Don’t use coloured left borders to make a card stand out.

The images above are source backgrounds to choose from. In a finished layout, a product screen, mockup or workflow illustration always sits over the artwork. A headline beside the artwork on its own is not enough.

Keep the screen readable and detailed text on an opaque surface. Green stays dominant, with cream and light sage keeping the background open. Keep ordinary surfaces flat. The shared dark green treatment and the website’s closing gradient are the exceptions.

Use current product screens. Keep the labels, amounts and estimate wording legible. When preparing a new screenshot, use demonstration data and remove personal or client details before sharing it.

Marketing illustrations can explain a workflow, but they must not add controls, integrations or results that the product doesn’t have.

Use the shared ease-out curve. The bouncy curve is reserved for the mascot and small success moments. Respect the system’s reduced-motion preference.

The website’s dither artwork follows reduced-motion settings and stops when the page is hidden. Keep content readable before, during and after any effect.