# Lifty Brand Guidelines > How Lifty looks and sounds — logo, colour, type, graphics, photography and voice — for designers, writers and AI agents. Source: https://design.lifty.ski/ · Updated 2026-10-27 ## At a glance - Do: use only the brand palette — the four primaries, Off White, the Mixed Gradient and the documented digital extensions. - Do: use the supplied logo files as they are. - Don't: alter, recolour, skew, outline or add effects to the logo. - Don't: set body text in Coolvetica or Jorude — they are display faces. This guide explains the basic elements of Lifty's visual identity and how we use them to build the brand. Following it keeps every Lifty touchpoint consistent, memorable and meaningful for the people who ski with us. Lifty is turn-by-turn navigation for ski resorts: pick two points and it tells you which lifts and pistes to take, filtered by how you ride. It works offline, all day. The brand is **playful and adventurous, but clear and dependable** — approachable to a first-week beginner, exciting to someone who has skied for twenty years. ## What's here - [Voice](https://design.lifty.ski/voice.md) — Lifty sounds like a local guide — warm, brief, confident and specific. Never hype. - [Logo](https://design.lifty.ski/logo.md) — A playful two-peak mountain mark and a chunky custom wordmark, used together or apart, only in brand colours. - [Colour](https://design.lifty.ski/colour.md) — Bold, unexpected colour — teal and orange lead, mint and burgundy add depth, Off White gives room — plus functional colours for pistes and safety. - [Typography](https://design.lifty.ski/typography.md) — Coolvetica for headlines, Jorude for expressive moments, Poppins for everything you read. - [Graphics](https://design.lifty.ski/graphics.md) — The sun, the mountain line and contour patterns, plus stickers and oversized type, for energy beyond the logo. - [Iconography](https://design.lifty.ski/iconography.md) — Familiar, universally recognised symbols for places on the mountain, so riders understand them at a glance. - [Photography](https://design.lifty.ski/photography.md) — Authentic, energetic moments of adventure and friendship — unexpected angles, natural light, brand colours in the frame. - [In the app](https://design.lifty.ski/in-the-app.md) — How the brand meets iOS and Android — brand colour inside content, native system chrome around it. - [Downloads](https://design.lifty.ski/downloads.md) — Every logo in every colour, the brand patterns, design tokens and the agent-readable files. - [Open items](https://design.lifty.ski/open-items.md) — What the guide doesn't settle yet — questions for the designer, licences, and differences from the apps. ## For AI agents Every page has a Markdown twin: add `.md` to its URL (this page is [`/index.md`](/index.md)). [`/llms.txt`](/llms.txt) lists them all, [`/llms-full.txt`](/llms-full.txt) holds the whole guide in one file, and [`/DESIGN.md`](/DESIGN.md) is the compact version: tokens, pairings and rules. Design tokens are at [`/tokens.json`](/tokens.json) (W3C DTCG format) and [`/tokens.css`](/tokens.css). Inside the Lifty repository, read `brand/DESIGN.md` — it is the same file. ## Source Version 01 of the visual guidelines, by Designer By Day, 20 October 2026. Where this site and the PDF disagree, the [open items](https://design.lifty.ski/open-items.md) page says why. --- # Voice > Lifty sounds like a local guide — warm, brief, confident and specific. Never hype. Source: https://design.lifty.ski/voice · Updated 2026-10-27 · DRAFT ## At a glance - Do: name the place, the lift and the time — specifics beat adjectives. - Do: say what the rider needs to know, then stop. - Do: use skiers' words — piste, run, lift, gondola, chairlift, sector, blue / red / black. - Don't: use hype, superlatives or fake urgency (amazing, incredible, seamless, premium, passionate). - Don't: make a claim the product can't back up — especially about privacy. The designer's guidelines cover the visual identity. This page carries the voice from the brand working document (May 2026) so the two live in one place. It is a draft until reviewed. ## Personality: the local guide Not a friend who just moved here, and not a professional with a clipboard. The person who has skied this mountain for years, knows the shortcuts and which sector has the best afternoon light, and shares it without making you feel like a tourist. - **Warm, not chatty.** Says what you need to know, nothing more. - **Confident, not arrogant.** The route is right. No hedging. - **Grounded in place.** Speaks Pyrenees, not Alps by default. - **European, not precious about it.** - **Has depth.** Never talks down to experts, even while guiding beginners. ## Say this, not that | Don't say | Do say | |---|---| | "We're excited to help you navigate your ski adventure!" | "14 minutes to the Soldeu gondola. Take the Assaladors blue." | | "Explore endless possibilities across 6 amazing sectors!" | "You're in El Tarter. Grau Roig is two lifts east." | | "Download our app for a premium ski experience!" | "Works offline. Your battery thanks you." | | "Join our community of passionate skiers!" | — (don't say this at all) | ## Words **Use:** piste (not trail), run, slope, lift, gondola, chairlift, sector, blue / red / black, "turn-by-turn skiing", "navigate the mountain", "works offline". **Avoid:** premium, seamless, passionate, amazing, incredible, awesome, "disrupting skiing". ## Taglines From the visual guidelines' merchandise and alternative assets: - **Just follow the snow.** - **Your mountain playground.** - **Go Snow** — the sample button label. Taglines are set in Jorude (uppercase) or Coolvetica. Translations into Catalan, Spanish and French are still to be written; keep the full stop, it is part of the line. ## Truthful by default Privacy copy must say what Lifty really collects. Location stays on the phone unless a rider opts in to sharing anonymous ride data or backs up to their account; say exactly that, never "no data leaves your phone". --- # Logo > A playful two-peak mountain mark and a chunky custom wordmark, used together or apart, only in brand colours. Source: https://design.lifty.ski/logo · Updated 2026-10-27 ## At a glance - Do: use the supplied SVG files; pick the colour variant made for your background. - Do: colour the logo only in Mountain Teal, Electric Orange, Deep Burgundy or Icy Mint — black or white only where colour is impossible. - Do: keep clear space around the logo, doubled between Lifty and a partner logo. - Don't: skew, stretch, rotate, outline, add a shadow to, or two-tone the logo. - Don't: change the spacing between the mark and the wordmark, or delete an element. - Don't: place the logo on a jarring background or let anything cover it. ## The logomark Inspired by the mountains and designed for movement, the mark takes a playful approach to the traditional mountain silhouette. Instead of sharp peaks and rigid shapes, soft flowing curves reflect the natural rhythm of the slopes and the freedom of skiing and snowboarding. The organic form brings movement, adventure and personality: approachable to beginners, exciting to experienced riders. It is bold yet minimal — playful and professional — so it stays recognisable and works across digital platforms. The two uneven peaks give it a natural rhythm rather than a balanced, corporate look. The rising and falling line also suggests a journey across mountain terrain, which ties it to Lifty's purpose: navigation. - Mountain Teal (on #A4E8DE): https://design.lifty.ski/assets/logos/mark/mountain-teal.svg - Icy Mint (on #142C30): https://design.lifty.ski/assets/logos/mark/icy-mint.svg - Deep Burgundy (on #FF541F): https://design.lifty.ski/assets/logos/mark/deep-burgundy.svg - Electric Orange (on #4C192A): https://design.lifty.ski/assets/logos/mark/electric-orange.svg - Off White (on #142C30): https://design.lifty.ski/assets/logos/mark/off-white.svg - Black (on #FFFFFF): https://design.lifty.ski/assets/logos/mark/black.svg - White (on #000000): https://design.lifty.ski/assets/logos/mark/white.svg ## The wordmark The wordmark is bold, playful and full of personality. Chunky letterforms, rounded edges and subtle curves make it friendly and approachable — a move away from the rigid, technical type of most outdoor brands. The custom lettering adds movement and individuality and complements the fluid mark. Its strong, clean silhouette keeps it readable and recognisable on every platform: youthful energy, balanced with function and professionalism. - Mountain Teal (on #A4E8DE): https://design.lifty.ski/assets/logos/wordmark/mountain-teal.svg - Icy Mint (on #142C30): https://design.lifty.ski/assets/logos/wordmark/icy-mint.svg - Deep Burgundy (on #FF541F): https://design.lifty.ski/assets/logos/wordmark/deep-burgundy.svg - Electric Orange (on #4C192A): https://design.lifty.ski/assets/logos/wordmark/electric-orange.svg - Off White (on #142C30): https://design.lifty.ski/assets/logos/wordmark/off-white.svg - Black (on #FFFFFF): https://design.lifty.ski/assets/logos/wordmark/black.svg - White (on #000000): https://design.lifty.ski/assets/logos/wordmark/white.svg ## Logo lockup The full logo brings the mark and the wordmark together: organic curves and strong letterforms that feel energetic and balanced while staying clean and professional. The lockup can be used **with or without the sun**. The sun adds warmth, optimism and playfulness; the simpler version keeps a strong identity on both digital and physical touchpoints. - Mountain Teal (on #A4E8DE): https://design.lifty.ski/assets/logos/lockup/mountain-teal.svg - Icy Mint (on #142C30): https://design.lifty.ski/assets/logos/lockup/icy-mint.svg - Deep Burgundy (on #FF541F): https://design.lifty.ski/assets/logos/lockup/deep-burgundy.svg - Electric Orange (on #4C192A): https://design.lifty.ski/assets/logos/lockup/electric-orange.svg - Off White (on #142C30): https://design.lifty.ski/assets/logos/lockup/off-white.svg - Black (on #FFFFFF): https://design.lifty.ski/assets/logos/lockup/black.svg - White (on #000000): https://design.lifty.ski/assets/logos/lockup/white.svg ## Secondary logos The **landscape** logo is a compact horizontal alternative for layouts where the stacked lockup doesn't fit. - Mountain Teal (on #A4E8DE): https://design.lifty.ski/assets/logos/landscape/mountain-teal.svg - Icy Mint (on #142C30): https://design.lifty.ski/assets/logos/landscape/icy-mint.svg - Deep Burgundy (on #FF541F): https://design.lifty.ski/assets/logos/landscape/deep-burgundy.svg - Electric Orange (on #4C192A): https://design.lifty.ski/assets/logos/landscape/electric-orange.svg - Off White (on #142C30): https://design.lifty.ski/assets/logos/landscape/off-white.svg - Black (on #FFFFFF): https://design.lifty.ski/assets/logos/landscape/black.svg - White (on #000000): https://design.lifty.ski/assets/logos/landscape/white.svg The **sun** adds a layer of playfulness and creative freedom. Its colour, size and placement can change — behind the lockup in Icy Mint, for example — so the brand feels fresh without losing consistency. ## Logo colours Logos are coloured only in the primary colours: Mountain Teal, Electric Orange, Deep Burgundy and Icy Mint. Where the logo absolutely cannot be printed in brand colour, or for accessibility in digital use, black and white may be used. The tiles above show each colour on the background it is made for: | Logo colour | Background | |---|---| | Icy Mint | Mountain Teal | | Deep Burgundy | Electric Orange | | Electric Orange | Deep Burgundy | | Mountain Teal | Icy Mint | | White | Black | | Black | White | ## Clear space and co-branding Keep clear space around the logo so it is never crowded. With a partner, duplicate the clear space and place it between the two logos: the gap between Lifty and a co-brand is **double** the logo's own clear space. Both the wordmark and the mark can be co-branded, as `lifty × Partner`. The clear-space unit ("X") and minimum sizes are not yet defined — see [open items](https://design.lifty.ski/open-items.md). ## Placement Where the logo sits on a digital or printed canvas. Include it wherever is best for your design — this isn't a one-size-fits-all rule. 1. Wordmark, bottom centre 2. Mark top centre, wordmark bottom centre 3. Lockup with the sun, bottom right 4. Mark, top left 5. Landscape logo, bottom centre 6. Wordmark large, centred 7. Landscape logo, top left (landscape canvas) ## Misuse Don't misinterpret, modify or add to the logo. Its orientation, colour and composition stay as shown here. These rules apply to every form: mark, wordmark, lockup and landscape. The examples are the likeliest mistakes, not an exhaustive list. - Don't skew or stretch the logo. - Don't outline the logo. - Don't add a drop shadow. - Don't rotate the logo. - Don't make the logo two-tone. - Don't use jarring colour backgrounds. - Don't let anything obstruct the logo. - Don't change the spacing between the mark and the wordmark. - Don't delete elements of the logo. --- # Colour > Bold, unexpected colour — teal and orange lead, mint and burgundy add depth, Off White gives room — plus functional colours for pistes and safety. Source: https://design.lifty.ski/colour · Updated 2026-10-27 ## At a glance - Do: lead with Mountain Teal and Electric Orange (30% each); Icy Mint and Deep Burgundy 15% each; Off White 10%. - Do: use only the approved pairings for text. - Do: use Orange Ink (#BF3A0B), not Electric Orange, for small orange text or links on light backgrounds. - Do: pair every functional colour with an icon or words — never colour alone. - Don't: introduce any colour outside the palette and its digital extensions. - Don't: fill type with the Mixed Gradient. - Don't: set body text in Electric Orange on white or Off White — it fails contrast (3.2:1). Lifty's palette breaks away from the expected. Instead of the blues and icy tones most ski and snowboard brands use, it brings a bold mix that captures the excitement, energy and freedom of the mountains. Vibrant orange and fresh mint bring playful, youthful energy; deep teal and rich burgundy keep it grounded and confident. The palette stands out on screen and stays bold and punchy in print. With soft Off White and expressive gradients, it is modern, versatile, adventurous, approachable — and unmistakably Lifty. ## Primary colours | Colour | Hex | RGB | CMYK | CSS token | Use | |---|---|---|---|---|---| | Mountain Teal | `#142C30` | 20, 44, 48 | 89, 62, 61, 62 | `--color-primary-mountain-teal` | Confidence, clarity and structure. Dark panels, ink on light grounds. | | Electric Orange | `#FF541F` | 255, 84, 31 | 0, 87, 100, 0 | `--color-primary-electric-orange` | Energy, excitement and personality. Fills, CTAs, the mark. Never small text on a light ground (use extension.orange-ink). | | Icy Mint | `#A4E8DE` | 164, 232, 222 | 38, 0, 19, 0 | `--color-primary-icy-mint` | Fresh, playful contrast. Accents on teal and burgundy; teal or burgundy text on it. | | Deep Burgundy | `#4C192A` | 76, 25, 42 | 45, 91, 59, 57 | `--color-primary-deep-burgundy` | Grounded depth. Hero panels; off-white, mint or orange display text on it. | ## Secondary colours | Colour | Hex | RGB | CMYK | CSS token | Use | |---|---|---|---|---|---| | Off White | `#F9F9F7` | 249, 249, 247 | 2, 1, 2, 0 | `--color-secondary-off-white` | Breathing room. Light grounds and text on dark panels. | **Mixed Gradient** (proposed): Mixed Gradient: icy cyan through teal and burgundy to orange, diagonal. Stops are read off the PDF swatch; the designer to confirm. CSS: `linear-gradient(150deg, #C8FFF9 0%, #0E3A44 35%, #4C192A 65%, #FF541F 100%)` ## Digital extensions Some colours of the palette can't carry small text on screen: Electric Orange on white is 3.2:1, and accessibility guidelines (WCAG AA) ask for 4.5:1. Dark mode needs teal and burgundy that don't vanish on a dark ground. These extensions solve exactly that and nothing else — **screen only, one job each, never in print and never as a brand colour in their own right**. They are proposed until the designer confirms the exact values. | Colour | Hex | RGB | CMYK | CSS token | Use | |---|---|---|---|---|---| | Orange Ink (proposed) | `#BF3A0B` | 191, 58, 11 | — | `--color-extension-orange-ink` | Orange text, links and small icons on light grounds (white, off-white). Electric Orange there is 3.2:1 and fails body-text contrast. | | Lifted Teal (proposed) | `#2A5157` | 42, 81, 87 | — | `--color-extension-teal-lifted` | Mountain Teal in dark mode. #142C30 vanishes on a dark ground (#1C1C1E). | | Lifted Burgundy (proposed) | `#7A2E46` | 122, 46, 70 | — | `--color-extension-burgundy-lifted` | Deep Burgundy in dark mode. #4C192A reads as a hole on a dark ground. | | Contour (proposed) | `#1E4147` | 30, 65, 71 | — | `--color-extension-contour` | Topographic contour lines drawn over Mountain Teal. | | Snow Blue (proposed) | `#3D7FE0` | 61, 127, 224 | — | `--color-extension-snow-blue` | New snow, forecasts and alerts in the app. | ## Colour hierarchy Mountain Teal and Electric Orange lead at 30% each: teal brings confidence, clarity and structure; orange brings energy, excitement and personality. Icy Mint and Deep Burgundy make up 15% each, adding contrast, depth and room for creative expression. Off White completes the balance at 10%, giving layouts room to breathe. These proportions are a flexible guide, not a strict rule. - Mountain Teal `#142C30`: 30% - Electric Orange `#FF541F`: 30% - Icy Mint `#A4E8DE`: 15% - Deep Burgundy `#4C192A`: 15% - Off White `#F9F9F7`: 10% ## Colour pairings The approved pairings for text and supporting elements. Each tile shows its contrast ratio: **AA** passes for body text, **Large text** only for headlines (24 px and up, or 19 px bold), **Fail** never for reading. | Text on ground | Approved | Contrast | Why not | |---|---|---|---| | White on Mountain Teal | Yes | 14.66:1 (AAA) | | | White on Electric Orange | Yes | 3.21:1 (Large text) | | | Mountain Teal on Icy Mint | Yes | 10.59:1 (AAA) | | | Electric Orange on Deep Burgundy | Yes | 4.42:1 (Large text) | | | White on Mixed Gradient | Yes | n/a (gradient) | | | Deep Burgundy on Off White | Yes | 13.46:1 (AAA) | | | Icy Mint on Mountain Teal | Yes | 10.59:1 (AAA) | | | Deep Burgundy on Electric Orange | Yes | 4.42:1 (Large text) | | ### Pairings to avoid These create too much (or too little) contrast, or simply don't go together. | Text on ground | Approved | Contrast | Why not | |---|---|---|---| | Contour on Mountain Teal | No | 1.33:1 (Fail) | Too little contrast. | | Mixed Gradient on Electric Orange | No | n/a (gradient) | Never fill type with the gradient. | | Electric Orange on Icy Mint | No | 2.32:1 (Fail) | The colours clash and the text is hard to read. | | Mountain Teal on Deep Burgundy | No | 1.03:1 (Fail) | Too little contrast. | | Mixed Gradient on Mixed Gradient | No | n/a (gradient) | Never fill type with the gradient. | | Icy Mint on Off White | No | 1.31:1 (Fail) | Too little contrast. | | Deep Burgundy on Mountain Teal | No | 1.03:1 (Fail) | Too little contrast. | | Icy Mint on Electric Orange | No | 2.32:1 (Fail) | The colours clash. | ### Every combination Contrast for every palette colour on every other, for anything the pairings above don't cover. | Text | Ground | Contrast | WCAG | |---|---|---|---| | Electric Orange | Mountain Teal | 4.56:1 | AA | | Icy Mint | Mountain Teal | 10.59:1 | AAA | | Deep Burgundy | Mountain Teal | 1.03:1 | Fail | | Off White | Mountain Teal | 13.90:1 | AAA | | Orange Ink | Mountain Teal | 2.67:1 | Fail | | Mountain Teal | Electric Orange | 4.56:1 | AA | | Icy Mint | Electric Orange | 2.32:1 | Fail | | Deep Burgundy | Electric Orange | 4.42:1 | Large text | | Off White | Electric Orange | 3.05:1 | Large text | | Orange Ink | Electric Orange | 1.71:1 | Fail | | Mountain Teal | Icy Mint | 10.59:1 | AAA | | Electric Orange | Icy Mint | 2.32:1 | Fail | | Deep Burgundy | Icy Mint | 10.26:1 | AAA | | Off White | Icy Mint | 1.31:1 | Fail | | Orange Ink | Icy Mint | 3.97:1 | Large text | | Mountain Teal | Deep Burgundy | 1.03:1 | Fail | | Electric Orange | Deep Burgundy | 4.42:1 | Large text | | Icy Mint | Deep Burgundy | 10.26:1 | AAA | | Off White | Deep Burgundy | 13.46:1 | AAA | | Orange Ink | Deep Burgundy | 2.59:1 | Fail | | Mountain Teal | Off White | 13.90:1 | AAA | | Electric Orange | Off White | 3.05:1 | Large text | | Icy Mint | Off White | 1.31:1 | Fail | | Deep Burgundy | Off White | 13.46:1 | AAA | | Orange Ink | Off White | 5.21:1 | AA | | Mountain Teal | Orange Ink | 2.67:1 | Fail | | Electric Orange | Orange Ink | 1.71:1 | Fail | | Icy Mint | Orange Ink | 3.97:1 | Large text | | Deep Burgundy | Orange Ink | 2.59:1 | Fail | | Off White | Orange Ink | 5.21:1 | AA | ## Colour schemes Suggested schemes for graphics, social content, marketing and posters: a background colour, a typography colour and a decorative colour. | Background | Typography | Decorative | |---|---|---| | Mountain Teal | Icy Mint | Deep Burgundy | | Electric Orange | Icy Mint | Mountain Teal | | Deep Burgundy | Off White | Electric Orange | | Off White | Mountain Teal | Icy Mint | | Mountain Teal | Mixed Gradient | Electric Orange | | Off White | Deep Burgundy | Mountain Teal | | Deep Burgundy | Mixed Gradient | Mountain Teal | | Mountain Teal | Off White | Electric Orange | | Deep Burgundy | Electric Orange | Off White | ## Functional colours Beyond the brand palette, functional colours support navigation, safety and clear communication in the app. They have a practical job: helping riders spot important information quickly. ### Piste colours The piste system shows slope difficulty with the familiar green, blue, red and black, so riders find runs that suit them at a glance. Follow each resort's or region's classification. | Colour | Hex | RGB | CMYK | CSS token | Use | |---|---|---|---|---|---| | Easy Green | `#A5D379` | 165, 211, 121 | 43, 0, 76, 0 | `--color-piste-easy` | | | Moderate Blue | `#5D8FE8` | 93, 143, 232 | 66, 39, 0, 0 | `--color-piste-moderate` | | | Moderate - Difficult Red | `#DD2626` | 221, 38, 38 | 0, 100, 100, 0 | `--color-piste-difficult` | | | Difficult Black | `#191919` | 25, 25, 25 | 73, 67, 65, 79 | `--color-piste-expert` | | ### Warnings and information Each safety colour has one role, from danger alerts and caution notices to first-aid locations and mandatory instructions. Use them consistently and always with a clear icon or words, so the message never relies on colour alone. | Colour | Hex | RGB | CMYK | CSS token | Use | |---|---|---|---|---|---| | Danger | `#DD2626` | 221, 38, 38 | 0, 100, 100, 0 | `--color-signal-danger` | | | Warning | `#FF9B57` | 255, 155, 87 | 0, 52, 77, 0 | `--color-signal-warning` | | | Caution | `#FCDF65` | 252, 223, 101 | 0, 10, 82, 0 | `--color-signal-caution` | | | Safe / first aid | `#A5D379` | 165, 211, 121 | 43, 0, 76, 0 | `--color-signal-safe` | | | Mandatory instructions | `#5D8FE8` | 93, 143, 232 | 66, 39, 0, 0 | `--color-signal-mandatory` | | Danger shares its value with the red piste, Safe with the green and Mandatory with the blue — on purpose, so the system stays small. Where the app's current status colours differ, see [open items](https://design.lifty.ski/open-items.md). --- # Typography > Coolvetica for headlines, Jorude for expressive moments, Poppins for everything you read. Source: https://design.lifty.ski/typography · Updated 2026-10-27 ## At a glance - Do: keep Coolvetica headlines short — a few words. - Do: use Poppins for body copy, app navigation, labels and information. - Do: keep subheads ≤ 33% of the headline's ascender height, and body ≤ 50% of the subhead's cap height. - Do: set Jorude in capitals, for taglines and stickers. - Don't: overuse the display typeface or set paragraphs in it. - Don't: open up the tracking or leading of display headlines — keep them tight. ## Primary typeface: Coolvetica Coolvetica is Lifty's primary typeface, chosen for its bold, chunky letterforms and playful personality. Rounded curves and soft edges make it friendly and inviting; its strong, confident structure keeps the brand modern, impactful and easy to recognise. It makes a statement without giving up legibility, bringing energy and character to headlines and display type. It complements the flowing logo and the brand's adventurous spirit: fun and functional, clean and professional. **Use for:** display, headings. - Role: Display, headings - CSS stack: `Coolvetica, Poppins, system-ui, sans-serif` - Licence: Typodermic free desktop licence: static use only. Webfont and app licences not bought yet. ## Decorative typeface: Jorude Jorude brings a rugged, adventurous edge. Its bold, irregular letterforms and textured look draw on the raw, untamed outdoors, adding movement, character and individuality. Used for expressive headlines and playful moments, Jorude contrasts with the softer, rounded Coolvetica. It adds personality and outdoor spirit and keeps the brand energetic, youthful and a little unexpected. **Use for:** expressive headlines, taglines, stickers. - Role: Expressive headlines - CSS stack: `Jorude, Poppins, system-ui, sans-serif` - Licence: Unknown: delivered without a licence file. ## Body copy: Poppins Poppins is the supporting typeface, chosen for its clean, rounded letterforms and friendly feel. Its modern, geometric design complements the brand's playful personality while staying very legible — ideal for body copy, app navigation, information and everyday communication. A wide range of weights gives the flexibility for clear hierarchy in digital and print. Its simplicity balances the bolder display faces and keeps Lifty's communication consistent, accessible and easy to navigate. **Use for:** body, information, paragraphs, labels. - Role: Body, info, paragraphs, labels - CSS stack: `Poppins, system-ui, sans-serif` - Licence: SIL Open Font License 1.1 ## Type size relationship With all three typefaces in one layout, keep a clear hierarchy: a **subheadline is no larger than 33% of the headline's ascender height**, and **body copy is no larger than 50% of the subheadline's cap height**. | Level | Typeface | Rule | |---|---|---| | Headline | Coolvetica | Short — a few words. Never overused. | | Subheadline | Poppins Bold (or Jorude for expressive moments) | ≤ 33% of the headline's ascender height | | Body | Poppins Regular / Light | ≤ 50% of the subheadline's cap height | | Label / button | Poppins Bold | e.g. a "Go Snow" button: Off White on Mountain Teal | - `subhead-to-headline` = 0.33: A subheadline is no larger than 33% of the headline's ascender height. - `body-to-subhead` = 0.5: Body copy is no larger than 50% of the subheadline's cap height. The display face should never be overused or run to many words. The subheading face does the heavy lifting on subheads, and the body face handles small, medium and large bodies of text. ## Display leading and tracking Spacing makes or breaks a headline. Leading is the space between lines; tracking is the space between letters. Coolvetica headlines are set **tight**: lines close together and letters at their default spacing, so a two-line headline reads as one shape. Too-open leading splits it into separate lines; extra tracking makes it look loose and unsightly. Exact values are still to come from the designer — see [open items](https://design.lifty.ski/open-items.md). ## Fonts on screens Poppins is free (SIL Open Font License) and self-hosted on this site. Coolvetica's licence covers static use only — print, images, merchandise — so until web and app licences are bought, this site shows Coolvetica and Jorude as outlined images, and products use Poppins in their place. --- # Graphics > The sun, the mountain line and contour patterns, plus stickers and oversized type, for energy beyond the logo. Source: https://design.lifty.ski/graphics · Updated 2026-10-27 ## At a glance - Do: repeat, resize and rearrange the sun; step-and-repeat the mountain line; use contours for maps and navigation. - Do: crop the mark and the sun boldly, past the edge of the layout. - Do: build stickers from the mark, sun, trees and contours, in a circle, in brand colours. - Do: use one pattern per surface — contours, the mountain line or dots, never two. - Do: run contours and the mountain line edge to edge; only dots sit in part of a surface. - Do: draw contours at one zoom everywhere, from a fixed piece of the sheet per surface, summit in a corner, fading away from it. - Do: zoom the mountain line until no mark's end is visible inside the surface. - Do: keep dots as one cluster hanging off a corner, cropped by its edges. - Do: give a surface one motif — the big sun or the cropped mark — in the corner opposite the text. - Don't: draw patterns in colours outside the palette. - Don't: put the big sun on a surface with dots, or let any pattern or motif sit behind body text. - Don't: tile contours, scale them per surface or cut a random piece each time. ## Brand patterns The patterns add energy, movement and personality. Drawn from the logo and the mountain environment, they form a flexible system that adds vibrancy, texture and interest in digital and print. The **sun** can be repeated, resized and rearranged into bold, playful patterns. The flowing **mountain** silhouette becomes a dynamic step-and-repeat that captures the rhythm of the slopes. **Topographic contour** lines connect to maps, terrain and navigation, reinforcing Lifty's purpose as a mountain guide. Together they make a visual language that is adventurous, expressive and unmistakably Lifty. - Sun repeat: The sun, repeated. Shown on Deep Burgundy. https://design.lifty.ski/assets/patterns/sun-repeat.svg - Mountain range: The mark's silhouette as a step-and-repeat. Shown on Mountain Teal. https://design.lifty.ski/assets/patterns/mountain-range.svg - Contour: Topographic lines: maps, terrain, navigation. The file carries its own near-black ground (#231F20). https://design.lifty.ski/assets/patterns/contour.svg ## Using patterns Patterns are texture, not content. A surface reads well when it has **one pattern, one motif and one place for text**, each in its own corner. The rules below come from how the apps already draw them, so a card in the app and a page here look like pieces of the same map. ### One pattern per surface Pick contours, the mountain line or dots. Mixing them turns texture into noise. A surface may also carry no pattern at all. ### Contours fill the whole surface Contour lines are a map, and a map doesn't stop halfway across the page. They always run edge to edge, with these rules: - **One zoom.** Every surface shows the lines at the same scale (about 23 px apart on screen), so cards, headers and posters read as parts of one terrain. Never scale the sheet up or down to fit. - **A fixed piece per surface.** Each surface is cut from the same contour sheet with a stable name (for example `band-colour`) that chooses which summit it centres on and how the sheet is turned. The same surface always shows the same terrain; never tile the sheet or cut a random piece each time. - **Summit in a corner, text in the clear.** The summit (the innermost rings) sits near the top-right corner. The lines are strongest there and fade to a third of their strength at the far edge, so text on the other side stays easy to read. - **Thin, single colour.** One palette colour at a low opacity; never two colours, never thick strokes. ### The mountain line is zoomed in The mountain line is the mark repeated at an angle. Zoom it in until **no end of any mark is visible** inside the surface: it should read as broad, flowing bands, not as a row of logos. Like contours, it fills the surface edge to edge, in one palette colour at a low opacity, so it sits behind everything else. ### Dots are a cluster, not wallpaper Dots are the sun repeated, so they behave like a graphic, not a texture: - **One cluster per surface**: a short grid (five across, three down) hanging off one corner and cropped by both edges, never a field across the whole surface. - **Even rhythm.** Each disc is about 82% of the spacing between them (42 to 51), the same everywhere, so the gaps read as deliberately as the dots. - **Full strength, one colour.** Orange on Deep Burgundy, burgundy on orange, as in the guidelines. Dots don't fade; they are either there or not. - **Never behind text.** The cluster sits in the corner away from the words. ### One motif The big sun and the cropped mark are each a hero: give a surface one of them, in the corner opposite the text (bottom-right for left-aligned text). The pattern gathers in the top corner, the motif in the bottom one. - **The sun never joins dots.** The dots are suns already; a big sun beside them reads as one dot too many. Pair the sun with contours, the mountain line or nothing. - **The mark** can be enlarged and cropped by two edges at once. It never overlaps text and is never rotated or two-toned. - **Small surfaces drop the motif.** If a card is too small to keep the pattern and the motif in separate corners, leave the motif out — a crowded corner is worse than a quiet one. ## Stickers The icon stickers draw on the mountains, adventure and the Lifty visual language. They bring the brand to life simply and recognisably across the app, social content, merchandise and marketing. Each sticker uses key brand elements — the mountain silhouette, the sun, trees and topographic lines — in the bold palette. The circular format gives them a friendly, collectible feel, good for highlighting features, making icons or adding flair. Sticker set examples: the mark under a sun inside a teal circle with an orange ring; a white tree on an orange circle; contour lines in an orange disc; `lifty` and `www.lifty.ski` as outlined type stickers; "YOUR MOUNTAIN PLAYGROUND." in Jorude on an orange outline. Sticker artwork files are not in the delivered package yet. ## Alternative assets These extend the identity beyond the logo with more personality and creative freedom. The **sun** becomes a bold circular graphic that can be resized, cropped and used in unexpected ways. **Expressive typography**, oversized letterforms and sticker-style graphics add fun and individuality — for example `ift` cropped huge in Electric Orange on Deep Burgundy, or "JUST FOLLOW THE SNOW." in Jorude on Icy Mint. Experiment with scale, placement, colour and playful text arrangements, while keeping Lifty consistent and recognisable. --- # Iconography > Familiar, universally recognised symbols for places on the mountain, so riders understand them at a glance. Source: https://design.lifty.ski/iconography · Updated 2026-10-27 ## At a glance - Do: use familiar, universally recognised symbols — one icon per meaning. - Do: in the apps, draw icons from the app's icon registry, not ad-hoc images. - Don't: use emoji as product icons. Points-of-interest icons make mountain navigation simple, intuitive and accessible. Familiar symbols let riders spot essential places — restaurants, bars, toilets, medical posts, ticket offices, ski schools, meeting points — without explanation. They are clear at a glance, which matters when you're checking the app on the move. Familiarity and function come first, so riders spend less time searching and more time on the mountain. ## In the apps The apps already ship a full icon system: Material Symbols (rounded, filled), Temaki and a few Noun Project icons, each place type with its own colour. One registry per platform holds one icon per meaning — `AppIcon` on iOS, `LiftyIcons` on Android, built from `design/icons/` in the repository. Use those, not the emoji shown as placeholders in the PDF; emoji artwork can't ship in a product. | Place | Meaning | |---|---| | Restaurant | Food & drink | | Bar | Drinks | | Toilet | Toilets | | Medical | First aid, medical post | | Ticket office | Lift passes | | Ski school | Lessons, meeting a class | | Meeting point | Agreed place to meet | --- # Photography > Authentic, energetic moments of adventure and friendship — unexpected angles, natural light, brand colours in the frame. Source: https://design.lifty.ski/photography · Updated 2026-10-27 ## At a glance - Do: show real moments — friends laughing on a chairlift, someone carving fresh powder. - Do: shoot low angles, close-ups, interesting crops and candid moments. - Do: look for brand colours in clothing, equipment and surroundings. - Do: keep logos and type over photos legible, with strong contrast. - Don't: over-polish or stage the edit. ## Style Freedom, excitement and spontaneity. Imagery feels authentic, energetic and inviting, showing real moments of adventure, friendship and fun. Where possible, clothing, equipment and surroundings carry Lifty's vibrant colours, creating quiet links that strengthen recognition. ## Angles Unexpected angles, playful perspectives and dynamic compositions put the viewer in the action. Low-angle shots, close-ups, interesting crops and candid moments create movement and immersion. Whether it's friends laughing on a ski lift or someone carving through fresh powder, a photo should make you feel part of the adventure. ## Post-production Embrace natural sunlight, snowy textures and movement for an energetic, contemporary look. Editing enhances the atmosphere without feeling polished or staged, keeping images authentic, youthful and approachable, and consistent across digital and print. ## Overlays Graphic overlays bring photography and branding together in bold, playful compositions. Brand colour overlays add consistency and contrast and bring Lifty's personality into every application. Logos, type and graphics can sit directly on photography or colour, as long as they keep strong contrast and stay clearly legible. Experiment with scale, position and colour while keeping the design clean, balanced and accessible. The mountain mark can be enlarged, cropped and run past the edges of a layout for unexpected framing. With the sun, contour patterns and bold type, these treatments add depth, movement and energy. Examples from the guidelines: "JUST FOLLOW THE SNOW." in Jorude over a close-up; the wordmark on Electric Orange with contour lines; an orange mountain line sweeping through a snowboarder's shot; an Off White sun and a burgundy mountain band over snowy peaks. ## Photo library The sample photographs delivered with the guidelines are not published here until their licence is confirmed. --- # In the app > How the brand meets iOS and Android — brand colour inside content, native system chrome around it. Source: https://design.lifty.ski/in-the-app · Updated 2026-10-27 ## At a glance - Do: put brand colour inside content — cards, tiles, buttons, hero panels. - Do: use stock system chrome — navigation bars, tab bars, toggles, alerts. - Do: read colours from the platform's brand tokens, never a hard-coded hex. - Do: show status with a dot and a word, never colour alone. - Don't: tint system bars, toggles or alerts with brand colours. The apps follow the platforms' own look — Liquid Glass on iOS, Material 3 on Android — and the brand lives inside the content. Lifty should feel at home on the phone and unmistakably Lifty on the screen. ## Where colour goes | Element | Colour | |---|---| | Primary action (route, record) | Electric Orange fill, white label (large, bold) | | Orange text, links, checkmarks on light grounds | Orange Ink | | Dark hero panels and cards | Mountain Teal, with contour lines in Contour | | Celebration and collection heroes | Deep Burgundy | | Good news and badges on teal or burgundy | Icy Mint | | Dark mode panels | Lifted Teal, Lifted Burgundy | | Piste difficulty | Piste colours, with the difficulty name | | Status (open, limited, closed) | A coloured dot beside the word | ## In code Today the colours live in `ios/…/App/Brand.swift` and `android/…/ui/theme/Color.kt`, under older names (`alpine`, `plum`, `iceMint`, `cream`, Sunset Orange). The next phase generates both from this guide's tokens and renames them to match. Until then, the [colour page](https://design.lifty.ski/colour.md) lists the code name next to each token. Type in the apps is the system font (SF Pro, Roboto) with Unbounded for hero numbers. The brand typefaces arrive with their app licences. --- # Downloads > Every logo in every colour, the brand patterns, design tokens and the agent-readable files. Source: https://design.lifty.ski/downloads · Updated 2026-10-27 ## At a glance - Do: download logos from here rather than copying them out of documents. - Do: use SVG wherever the medium allows it. All logos are SVG, in seven colours. Each logo colour belongs on a specific background — the [logo page](https://design.lifty.ski/logo.md) shows which. - Logo lockup: https://design.lifty.ski/assets/logos/lockup/mountain-teal.svg, https://design.lifty.ski/assets/logos/lockup/icy-mint.svg, https://design.lifty.ski/assets/logos/lockup/deep-burgundy.svg, https://design.lifty.ski/assets/logos/lockup/electric-orange.svg, https://design.lifty.ski/assets/logos/lockup/off-white.svg, https://design.lifty.ski/assets/logos/lockup/black.svg, https://design.lifty.ski/assets/logos/lockup/white.svg - Logomark: https://design.lifty.ski/assets/logos/mark/mountain-teal.svg, https://design.lifty.ski/assets/logos/mark/icy-mint.svg, https://design.lifty.ski/assets/logos/mark/deep-burgundy.svg, https://design.lifty.ski/assets/logos/mark/electric-orange.svg, https://design.lifty.ski/assets/logos/mark/off-white.svg, https://design.lifty.ski/assets/logos/mark/black.svg, https://design.lifty.ski/assets/logos/mark/white.svg - Wordmark: https://design.lifty.ski/assets/logos/wordmark/mountain-teal.svg, https://design.lifty.ski/assets/logos/wordmark/icy-mint.svg, https://design.lifty.ski/assets/logos/wordmark/deep-burgundy.svg, https://design.lifty.ski/assets/logos/wordmark/electric-orange.svg, https://design.lifty.ski/assets/logos/wordmark/off-white.svg, https://design.lifty.ski/assets/logos/wordmark/black.svg, https://design.lifty.ski/assets/logos/wordmark/white.svg - Landscape logo: https://design.lifty.ski/assets/logos/landscape/mountain-teal.svg, https://design.lifty.ski/assets/logos/landscape/icy-mint.svg, https://design.lifty.ski/assets/logos/landscape/deep-burgundy.svg, https://design.lifty.ski/assets/logos/landscape/electric-orange.svg, https://design.lifty.ski/assets/logos/landscape/off-white.svg, https://design.lifty.ski/assets/logos/landscape/black.svg, https://design.lifty.ski/assets/logos/landscape/white.svg - Patterns: https://design.lifty.ski/assets/patterns/sun-repeat.svg, https://design.lifty.ski/assets/patterns/mountain-range.svg, https://design.lifty.ski/assets/patterns/contour.svg - Design tokens: https://design.lifty.ski/tokens.json (W3C DTCG), https://design.lifty.ski/tokens.css - For AI agents: https://design.lifty.ski/DESIGN.md, https://design.lifty.ski/llms.txt, https://design.lifty.ski/llms-full.txt Fonts are not distributed here: Poppins is free from Google Fonts; Coolvetica and Jorude are licensed separately. --- # Open items > What the guide doesn't settle yet — questions for the designer, licences, and differences from the apps. Source: https://design.lifty.ski/open-items · Updated 2026-10-27 ## Decided (27 October 2026) - **The site is public.** It can be password-protected later. - **The designer's colour names are canonical.** The apps' older names are renamed when their colours are generated from these tokens. - **Digital extensions are official**, screen only: Orange Ink, Lifted Teal, Lifted Burgundy, Contour and Snow Blue, each with one job. - **Font licences come after the guide is final.** Until then Coolvetica and Jorude appear only as images. ## For the designer - Confirm the digital-extension values: Orange Ink #BF3A0B, Lifted Teal #2A5157, Lifted Burgundy #7A2E46, Contour #1E4147, Snow Blue #3D7FE0. - Define the clear-space unit ("X") and minimum sizes for each logo form, in print and on screen. - Give display leading and tracking as numbers. - Give the Mixed Gradient's colour stops and angle (this site reads them off the PDF swatch). - The pattern files use colours outside the palette: `mountain-range.svg` is #8EE9DD (Icy Mint is #A4E8DE), `sun-repeat.svg` #FF3F00 (Electric Orange is #FF541F), and `contour.svg` draws white lines on a baked-in #231F20 ground — the guide shows contours on Electric Orange, so a transparent version is needed. - The type-size page labels its headline "Averique Demo" — confirm it is Coolvetica. - The iconography page shows emoji; the apps' icon system should replace them. - Supply the app icon and favicon specs, dark-mode pairings and the sticker artwork. - The sun lockup is described but only the plain lockup is in the files. ## Functional colours vs the apps Danger and Moderate–Difficult Red share #DD2626, Safe matches Easy Green and Mandatory matches Moderate Blue. The apps' status colours today are #26B767 (open), #FC990E (limited) and #F3382B (closed), and their piste palette was tuned for the map in light and dark. One set needs to win. ## Licences - **Coolvetica** (Typodermic): the free desktop licence covers static use only. Web and app embedding need a separate licence. - **Jorude**: delivered without a licence file; source unknown. - **Poppins**: SIL Open Font License — free to embed. - **Photography**: the sample photos look like stock downloads; confirm their licence before publishing.