1. Configure
-- Enter your data and select the format. -
-diff --git a/linear.app/DESIGN.md b/linear.app/DESIGN.md new file mode 100644 index 0000000..1589d6d --- /dev/null +++ b/linear.app/DESIGN.md @@ -0,0 +1,548 @@ +--- +version: alpha +name: Linear +description: "A near-black product-focused marketing canvas built around #010102 (the deepest dark surface of any tool in this collection), light gray text (#f7f8f8), and the signature Linear lavender-blue (#5e6ad2) used as the single chromatic accent. The system reads as software-craft documentation: dense, technical, and quietly luxurious. Display type is set in the Linear custom sans (SF Pro Display fallback) at 500–700 with measured negative tracking. Cards live as charcoal panels (#0f1011) with hairline borders. The accent lavender appears on the brand mark, focus rings, and a few intentional CTAs — never decoratively. Page rhythm leans on product UI screenshots framed in dark panels rather than atmospheric color." + +colors: + primary: "#5e6ad2" + on-primary: "#ffffff" + primary-hover: "#828fff" + primary-focus: "#5e69d1" + ink: "#f7f8f8" + ink-muted: "#d0d6e0" + ink-subtle: "#8a8f98" + ink-tertiary: "#62666d" + canvas: "#010102" + surface-1: "#0f1011" + surface-2: "#141516" + surface-3: "#18191a" + surface-4: "#191a1b" + hairline: "#23252a" + hairline-strong: "#34343a" + hairline-tertiary: "#3e3e44" + inverse-canvas: "#ffffff" + inverse-surface-1: "#f5f6f6" + inverse-surface-2: "#f6f7f7" + inverse-ink: "#000000" + brand-secure: "#7a7fad" + semantic-success: "#27a644" + semantic-overlay: "#000000" + +typography: + display-xl: + fontFamily: Linear Display + fontSize: 80px + fontWeight: 600 + lineHeight: 1.05 + letterSpacing: -3.0px + display-lg: + fontFamily: Linear Display + fontSize: 56px + fontWeight: 600 + lineHeight: 1.10 + letterSpacing: -1.8px + display-md: + fontFamily: Linear Display + fontSize: 40px + fontWeight: 600 + lineHeight: 1.15 + letterSpacing: -1.0px + headline: + fontFamily: Linear Display + fontSize: 28px + fontWeight: 600 + lineHeight: 1.20 + letterSpacing: -0.6px + card-title: + fontFamily: Linear Display + fontSize: 22px + fontWeight: 500 + lineHeight: 1.25 + letterSpacing: -0.4px + subhead: + fontFamily: Linear Display + fontSize: 20px + fontWeight: 400 + lineHeight: 1.40 + letterSpacing: -0.2px + body-lg: + fontFamily: Linear Text + fontSize: 18px + fontWeight: 400 + lineHeight: 1.50 + letterSpacing: -0.1px + body: + fontFamily: Linear Text + fontSize: 16px + fontWeight: 400 + lineHeight: 1.50 + letterSpacing: -0.05px + body-sm: + fontFamily: Linear Text + fontSize: 14px + fontWeight: 400 + lineHeight: 1.50 + letterSpacing: 0 + caption: + fontFamily: Linear Text + fontSize: 12px + fontWeight: 400 + lineHeight: 1.40 + letterSpacing: 0 + button: + fontFamily: Linear Text + fontSize: 14px + fontWeight: 500 + lineHeight: 1.20 + letterSpacing: 0 + eyebrow: + fontFamily: Linear Text + fontSize: 13px + fontWeight: 500 + lineHeight: 1.30 + letterSpacing: 0.4px + mono: + fontFamily: Linear Mono + fontSize: 13px + fontWeight: 400 + lineHeight: 1.50 + letterSpacing: 0 + +rounded: + xs: 4px + sm: 6px + md: 8px + lg: 12px + xl: 16px + xxl: 24px + pill: 9999px + full: 9999px + +spacing: + xxs: 4px + xs: 8px + sm: 12px + md: 16px + lg: 24px + xl: 32px + xxl: 48px + section: 96px + +components: + button-primary: + backgroundColor: "{colors.primary}" + textColor: "{colors.on-primary}" + typography: "{typography.button}" + rounded: "{rounded.md}" + padding: 8px 14px + button-primary-pressed: + backgroundColor: "{colors.primary-focus}" + textColor: "{colors.on-primary}" + typography: "{typography.button}" + rounded: "{rounded.md}" + button-primary-hover: + backgroundColor: "{colors.primary-hover}" + textColor: "{colors.on-primary}" + typography: "{typography.button}" + rounded: "{rounded.md}" + button-secondary: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.button}" + rounded: "{rounded.md}" + padding: 8px 14px + button-tertiary: + backgroundColor: "{colors.canvas}" + textColor: "{colors.ink}" + typography: "{typography.button}" + rounded: "{rounded.md}" + padding: 8px 14px + button-inverse: + backgroundColor: "{colors.inverse-canvas}" + textColor: "{colors.inverse-ink}" + typography: "{typography.button}" + rounded: "{rounded.md}" + padding: 8px 14px + pricing-card: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.lg}" + padding: 24px + pricing-card-featured: + backgroundColor: "{colors.surface-2}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.lg}" + padding: 24px + feature-card: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.lg}" + padding: 24px + product-screenshot-card: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.xl}" + padding: 24px + testimonial-card: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.body-lg}" + rounded: "{rounded.lg}" + padding: 32px + customer-logo-tile: + backgroundColor: "{colors.canvas}" + textColor: "{colors.ink-subtle}" + typography: "{typography.caption}" + rounded: "{rounded.xs}" + padding: 16px + text-input: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.md}" + padding: 8px 12px + text-input-focused: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.md}" + padding: 8px 12px + pricing-tab-default: + backgroundColor: "{colors.canvas}" + textColor: "{colors.ink-subtle}" + typography: "{typography.button}" + rounded: "{rounded.pill}" + padding: 6px 14px + pricing-tab-selected: + backgroundColor: "{colors.surface-2}" + textColor: "{colors.ink}" + typography: "{typography.button}" + rounded: "{rounded.pill}" + padding: 6px 14px + cta-banner: + backgroundColor: "{colors.surface-1}" + textColor: "{colors.ink}" + typography: "{typography.headline}" + rounded: "{rounded.lg}" + padding: 48px + changelog-row: + backgroundColor: "{colors.canvas}" + textColor: "{colors.ink}" + typography: "{typography.body}" + rounded: "{rounded.xs}" + padding: 24px 0 + status-badge: + backgroundColor: "{colors.surface-2}" + textColor: "{colors.ink-muted}" + typography: "{typography.caption}" + rounded: "{rounded.pill}" + padding: 2px 8px + top-nav: + backgroundColor: "{colors.canvas}" + textColor: "{colors.ink}" + typography: "{typography.body-sm}" + rounded: "{rounded.xs}" + height: 56px + footer: + backgroundColor: "{colors.canvas}" + textColor: "{colors.ink-subtle}" + typography: "{typography.caption}" + rounded: "{rounded.xs}" + padding: 64px 32px +--- + +## Overview + +Linear's marketing canvas is the deepest dark surface in this collection — `{colors.canvas}` is #010102, essentially pure black with a faint blue tint. On top sits a four-step surface ladder (`{colors.surface-1}` through `{colors.surface-4}`) for cards, panels, and lifted tiles, with hairline borders running from `{colors.hairline}` (#23252a) up through `{colors.hairline-strong}` and `{colors.hairline-tertiary}`. Light gray text (`{colors.ink}` #f7f8f8) carries the body and headlines. + +The single chromatic accent is **Linear lavender-blue** `{colors.primary}` (#5e6ad2) — used on the brand mark, focus rings, and the primary CTA button. A lighter hover state (`{colors.primary-hover}` #828fff) and a focus-tinted variant (`{colors.primary-focus}` #5e69d1) extend the same hue. Linear avoids saturated greens, oranges, reds, etc. on the marketing canvas — the only semantic color is `{colors.semantic-success}` (#27a644) for status pills and the rare success indicator. + +Display type runs Linear's custom sans (with `SF Pro Display` fallback) at weight 500–700 with negative letter-spacing scaling from -3.0px at 80px down to 0 at body. The body family is Linear's text cut, and a Linear Mono is reserved for code snippets in product screenshots. + +The page rhythm is **dense product screenshots** — Linear's marketing leads with high-fidelity captures of the product UI (issue list, project view, dashboard) framed in `{colors.surface-1}` panels with `{rounded.xl}` 16px corners. The chrome is intentionally minimal so the app screenshots can do the heavy lifting. + +**Key Characteristics:** +- **Dark-canvas marketing system** — `{colors.canvas}` (#010102) is the deepest dark in this collection. +- **Lavender-blue brand accent** (`{colors.primary}` #5e6ad2) — used scarcely on brand mark, focus, and the primary CTA. +- Four-step surface ladder (canvas → surface-1 → surface-2 → surface-3 → surface-4) carries hierarchy without shadow. +- Display tracking pulls aggressively negative (-3.0px at 80px); body holds at -0.05px. +- Cards use `{rounded.lg}` 12px corners with 1px hairline borders — never pill, rarely 16px. +- **Product UI screenshots** dominate the page. The marketing chrome is a dark frame for the app. +- No second chromatic color. No atmospheric gradients. No spotlight cards. + +## Colors + +> Source pages: linear.app (home), /intake, /pricing, /contact/sales, /build. + +### Brand & Accent +- **Lavender-Blue** ({colors.primary}): The signature Linear accent — primary CTA, brand mark, link emphasis. +- **Lavender Hover** ({colors.primary-hover}): Lighter lavender (#828fff) — hovered state of the primary CTA. +- **Lavender Focus** ({colors.primary-focus}): Focus-ring tint (#5e69d1) — focused inputs, focused buttons. +- **Brand Secure** ({colors.brand-secure}): Muted lavender-gray (#7a7fad) — used in "Linear Security" surfaces. + +### Surface +- **Canvas** ({colors.canvas}): Default page background — #010102, near-pure black with a faint blue tint. +- **Surface 1** ({colors.surface-1}): One step above canvas — feature cards, pricing cards, product screenshot panels. +- **Surface 2** ({colors.surface-2}): Two steps above — featured pricing card, hovered cards. +- **Surface 3** ({colors.surface-3}): Three steps above — line-tertiary backgrounds, sub-nav. +- **Surface 4** ({colors.surface-4}): Four steps above — bg-level-3, deepest lifted surface. +- **Hairline** ({colors.hairline}): 1px borders on cards and dividers. +- **Hairline Strong** ({colors.hairline-strong}): Stronger 1px borders — input focus rings. +- **Hairline Tertiary** ({colors.hairline-tertiary}): Tertiary borders for nested surfaces. +- **Inverse Canvas** ({colors.inverse-canvas}): Pure white — surface of the inverse pill CTA on a small set of section openers. +- **Inverse Surface 1** ({colors.inverse-surface-1}): One step above inverse canvas. +- **Inverse Surface 2** ({colors.inverse-surface-2}): Two steps above inverse canvas. + +### Text +- **Ink** ({colors.ink}): All headlines and emphasized body type — light gray #f7f8f8. +- **Ink Muted** ({colors.ink-muted}): Secondary type at #d0d6e0 — meta info on hero panels. +- **Ink Subtle** ({colors.ink-subtle}): Tertiary type at #8a8f98 — deselected pricing tabs, footer columns. +- **Ink Tertiary** ({colors.ink-tertiary}): Quaternary at #62666d — disabled, footnotes. + +### Semantic +- **Success Green** ({colors.semantic-success}): Status pills, success indicators. The only semantic color on marketing. +- **Overlay** ({colors.semantic-overlay}): Pure black overlay scrim for modals. + +## Typography + +### Font Family + +- **Linear Display** — Linear's custom display sans; fallback `SF Pro Display, -apple-system, system-ui, Segoe UI, Roboto`. Carries display-xl through subhead. +- **Linear Text** — Linear's custom text sans (a slightly different cut tuned for body sizes); same fallback stack. Carries body sizes, button labels, captions. +- **Linear Mono** — Linear's custom mono; fallback `ui-monospace, SF Mono, Menlo`. Used for code snippets in product screenshots and for status / ID tokens. + +The marketing surface treats Display and Text as one continuous voice; the family change is silent. + +### Hierarchy + +| Token | Size | Weight | Line Height | Letter Spacing | Use | +|---|---|---|---|---|---| +| `{typography.display-xl}` | 80px | 600 | 1.05 | -3.0px | Largest hero headline | +| `{typography.display-lg}` | 56px | 600 | 1.10 | -1.8px | Section opener headlines | +| `{typography.display-md}` | 40px | 600 | 1.15 | -1.0px | Sub-section headlines | +| `{typography.headline}` | 28px | 600 | 1.20 | -0.6px | Pricing tier titles, CTA banner heading | +| `{typography.card-title}` | 22px | 500 | 1.25 | -0.4px | Feature card title | +| `{typography.subhead}` | 20px | 400 | 1.40 | -0.2px | Lead body, intro paragraphs | +| `{typography.body-lg}` | 18px | 400 | 1.50 | -0.1px | Hero subhead, lead paragraphs | +| `{typography.body}` | 16px | 400 | 1.50 | -0.05px | Default body | +| `{typography.body-sm}` | 14px | 400 | 1.50 | 0 | Card body, footer columns | +| `{typography.caption}` | 12px | 400 | 1.40 | 0 | Captions, meta, status | +| `{typography.button}` | 14px | 500 | 1.20 | 0 | All button labels | +| `{typography.eyebrow}` | 13px | 500 | 1.30 | 0.4px | Section eyebrow (slight positive tracking) | +| `{typography.mono}` | 13px | 400 | 1.50 | 0 | Linear Mono for code in product screenshots | + +### Principles + +- **Aggressive negative tracking on display** (-3.0px at 80px ≈ 4% of size). +- **Single voice from display to body.** Display-xl at 600 → body at 400 — same family, narrower weights. +- **Eyebrow uses positive tracking** (+0.4px) — contrast against the negative-tracked display marks the eyebrow as taxonomy. +- **Mono only in code contexts.** Linear Mono lives inside product screenshots — not on marketing chrome. + +### Note on Font Substitutes + +Linear's custom typeface isn't publicly distributed; the documented fallback `SF Pro Display, -apple-system, system-ui` is the recommended substitute on macOS. For cross-platform implementation, **Inter** at weight 500 / 600 / 700 is the closest free substitute. **Geist Sans** is also viable. For mono, **JetBrains Mono** or **Geist Mono** at weight 400 closely approximates Linear Mono. + +## Layout + +### Spacing System + +- **Base unit**: 4px. +- **Tokens (front matter)**: `{spacing.xxs}` 4px · `{spacing.xs}` 8px · `{spacing.sm}` 12px · `{spacing.md}` 16px · `{spacing.lg}` 24px · `{spacing.xl}` 32px · `{spacing.xxl}` 48px · `{spacing.section}` 96px. +- Card interior padding: `{spacing.lg}` 24px on feature/pricing cards; `{spacing.xl}` 32px on testimonial cards; `{spacing.xxl}` 48px on CTA banners. +- Pill button padding: 8px vertical · 14px horizontal — Linear's compact button spec. +- Form input padding: 8px vertical · 12px horizontal. + +### Grid & Container + +- Max content width sits around 1280px. +- Card grids are 3-up at desktop, 2-up at tablet, 1-up at mobile. +- Pricing tier grid is 3-up; comparison strip below shows checkmarks per tier. +- Product screenshot panels span full content width — they're the protagonist. + +### Whitespace Philosophy + +The dark canvas IS the whitespace. Sections separate by lift onto surface-1 panels, not by gaps in white. Within a panel, generous `{spacing.lg}` 24px gaps between content blocks; `{spacing.section}` 96px between sections. + +## Elevation & Depth + +| Level | Treatment | Use | +|---|---|---| +| 0 (flat) | No shadow, no border | Default for body type, hero text, footer | +| 1 (charcoal lift) | `{colors.surface-1}` background on canvas, 1px `{colors.hairline}` | Default cards, product panels | +| 2 (surface-2 lift) | `{colors.surface-2}` background, 1px `{colors.hairline-strong}` | Featured pricing card, hovered cards | +| 3 (surface-3 lift) | `{colors.surface-3}` background | Sub-nav, dropdown menus | +| 4 (focus ring) | 2px `{colors.primary-focus}` outline at 50% opacity | Focused input, focused button | + +Linear's depth is carried by surface ladder + hairline borders. The brand resists drop shadows on dark almost entirely. + +### Decorative Depth + +- **Product UI screenshots** dominate as decorative depth. +- **No atmospheric gradients, no spotlight cards.** +- **Subtle white edge highlight** on the top edge of lifted panels — gives the dark surface a faint "pixel rendered" feel. + +## Shapes + +### Border Radius Scale + +| Token | Value | Use | +|---|---|---| +| `{rounded.xs}` | 4px | Small chips, status badges | +| `{rounded.sm}` | 6px | Inline tags | +| `{rounded.md}` | 8px | All buttons, form inputs | +| `{rounded.lg}` | 12px | Pricing cards, feature cards, testimonial cards | +| `{rounded.xl}` | 16px | Product screenshot panels | +| `{rounded.xxl}` | 24px | Oversized CTA banners (rare) | +| `{rounded.pill}` | 9999px | Pricing tab toggles, status pills | +| `{rounded.full}` | 9999px | Avatar circles | + +### Photography & Illustration Geometry + +- Product UI screenshots dominate; they sit in `{rounded.xl}` 16px tiles with `{spacing.lg}` 24px outer padding. +- Customer logo tiles render at small sizes (~24px logo height) on `{colors.canvas}` with no border. +- Avatar circles in testimonial cards use `{rounded.full}` at 32–40px sizes. + +## Components + +### Buttons + +**`button-primary`** — Lavender CTA. The default primary CTA across all pages. +- Background `{colors.primary}`, text `{colors.on-primary}`, type `{typography.button}`, padding 8px 14px, rounded `{rounded.md}`. +- Pressed state lives in `button-primary-pressed` (background shifts to `{colors.primary-focus}`). +- Hover state lives in `button-primary-hover` (background shifts to `{colors.primary-hover}` lighter lavender). + +**`button-secondary`** — Charcoal button. Used for secondary CTAs ("Sign in", "Read changelog"). +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.button}`, padding 8px 14px, rounded `{rounded.md}`. 1px `{colors.hairline}` border. + +**`button-tertiary`** — Plain text button. +- Background `{colors.canvas}`, text `{colors.ink}`, type `{typography.button}`, rounded `{rounded.md}`, padding 8px 14px. + +**`button-inverse`** — White-on-dark inverse CTA. +- Background `{colors.inverse-canvas}`, text `{colors.inverse-ink}`, type `{typography.button}`, rounded `{rounded.md}`, padding 8px 14px. + +### Pricing Tabs + +**`pricing-tab-default`** + **`pricing-tab-selected`** — Pill-toggle on `/pricing`. +- Default: `{colors.canvas}` background, `{colors.ink-subtle}` text, rounded `{rounded.pill}`, padding 6px 14px. +- Selected: `{colors.surface-2}` background, `{colors.ink}` text — selected = surface lift. + +### Cards & Containers + +**`pricing-card`** — Each tier on `/pricing`. +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.body}`, rounded `{rounded.lg}`, padding 24px. 1px `{colors.hairline}` border. + +**`pricing-card-featured`** — Recommended tier — surface lift to surface-2. +- Background `{colors.surface-2}`, otherwise identical structure. + +**`feature-card`** — Generic feature highlight tile. +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.body}`, rounded `{rounded.lg}`, padding 24px. + +**`product-screenshot-card`** — The dominant card type — frames a high-fidelity Linear app UI screenshot. +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.body}`, rounded `{rounded.xl}`, padding 24px. + +**`testimonial-card`** — Customer quote with avatar + name + role. +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.body-lg}`, rounded `{rounded.lg}`, padding 32px. + +**`customer-logo-tile`** — Small tile in the customer marquee. +- Background `{colors.canvas}`, text `{colors.ink-subtle}`, type `{typography.caption}`, rounded `{rounded.xs}`, padding 16px. + +**`cta-banner`** — Closing CTA panel near page bottom. +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.headline}`, rounded `{rounded.lg}`, padding 48px. + +### Inputs & Forms + +**`text-input`** + **`text-input-focused`** — Form fields on `/contact/sales` and signup overlays. +- Background `{colors.surface-1}`, text `{colors.ink}`, type `{typography.body}`, rounded `{rounded.md}`, padding 8px 12px. +- Focused state retains the same surface; the focus ring is a 2px `{colors.primary-focus}` outline at 50% opacity. + +### Status & Build Page + +**`changelog-row`** — Each row in `/build` (changelog page) listing version, date, and changes. +- Background `{colors.canvas}`, text `{colors.ink}`, type `{typography.body}`, rounded `{rounded.xs}`, padding 24px 0. 1px `{colors.hairline}` bottom rule. + +**`status-badge`** — Small status pill. +- Background `{colors.surface-2}`, text `{colors.ink-muted}`, type `{typography.caption}`, rounded `{rounded.pill}`, padding 2px 8px. + +### Navigation + +**`top-nav`** — Sticky dark bar with the Linear wordmark left, primary nav links centered, and a `button-secondary` ("Sign in") + `button-primary` ("Get started") pair right. +- Background `{colors.canvas}`, text `{colors.ink}`, type `{typography.body-sm}`, height 56px. + +### Footer + +**`footer`** — Dense link grid on `{colors.canvas}` with the Linear wordmark left. +- Background `{colors.canvas}`, text `{colors.ink-subtle}`, type `{typography.caption}`, padding 64px 32px. + +## Do's and Don'ts + +### Do + +- Reserve `{colors.canvas}` (#010102) as the system's anchor surface — the faint blue tint is intentional. +- Use `{colors.primary}` lavender ONLY for: brand mark, primary CTA, focus ring, link emphasis. +- Use the four-step surface ladder for hierarchy. Avoid skipping levels. +- Pair display weight 600 with body weight 400 — Linear resists 700+ display weights. +- Apply negative letter-spacing aggressively on display. +- Use product UI screenshots as the protagonist of every section. +- Compose CTAs as `{rounded.md}` 8px corners. + +### Don't + +- Don't ship a light-mode marketing page. +- Don't use lavender as a section background or card fill. +- Don't introduce a second chromatic accent (orange, pink, green for marketing). +- Don't add atmospheric gradients or spotlight cards. +- Don't pill-round CTAs. +- Don't use `#000000` true black as the canvas. +- Don't combine multiple bright accents in product screenshot mockups. + +## Responsive Behavior + +### Breakpoints + +| Name | Width | Key Changes | +|---|---|---| +| Desktop-XL | 1440px | Default desktop layout | +| Desktop | 1280px | Card grid 3-up maintained | +| Tablet | 1024px | Card grid 3-up → 2-up | +| Mobile-Lg | 768px | Pricing comparison becomes accordion; nav hamburger | +| Mobile | 480px | Single-column; display-xl scales 80px → ~36px | + +### Touch Targets + +- CTAs hold ≥40px tap height across viewports. +- Pricing tab pills hold ≥36px tap height; touch viewports grow to ≥44px. +- Form inputs hold ≥44px tap target on touch. + +### Collapsing Strategy + +- **Top nav**: links collapse to hamburger below 768px. +- **Card grids**: 3-up → 2-up at 1024px → 1-up below 768px. +- **Pricing comparison**: per-tier accordion below 768px. +- **Display type**: `{typography.display-xl}` 80px scales toward `{typography.display-md}` 40px on mobile. + +### Image Behavior + +- Product UI screenshots maintain aspect ratio and never crop. +- Customer logos in the marquee may collapse from 6-up to 3-up below 768px. + +## Iteration Guide + +1. Focus on ONE component at a time and reference it by its `components:` token name. +2. When introducing a section, decide first which surface lift it lives on. +3. Default body to `{typography.body}` at weight 400. +4. Run `npx @google/design.md lint DESIGN.md` after edits. +5. Add new variants as separate component entries. +6. Treat lavender as scarce: brand mark, primary CTA, focus, link emphasis. +7. Lead every section with a product UI screenshot. + +## Known Gaps + +- The four-step surface ladder values are extracted directly from Linear's `--color-bg-level-3`, `--color-line-tint`, etc. CSS variables; they are Linear's canonical surface spec. +- Form-field error and validation styling is not visible on the inspected pages. +- Light mode is not documented because the marketing site does not ship a light theme. +- Linear's actual product UI uses a richer color-tag palette (red, orange, yellow, green, blue, purple) for issue priorities and project labels — those colors live in the in-product surfaces shown in mockups. +- The custom display, text, and mono families are proprietary; an open-source substitute is acceptable. diff --git a/memory/upgrade_nudge_status.md b/memory/upgrade_nudge_status.md new file mode 100644 index 0000000..4a3c30c --- /dev/null +++ b/memory/upgrade_nudge_status.md @@ -0,0 +1,41 @@ +# Upgrade Nudge Status Memory + +Last updated: 2026-05-02 + +Purpose: local memory for upgrade-nudge outreach status when SMTP/Sent-folder evidence is incomplete. `sent_assumed_manual` means the user instructed us to treat the contact as already sent for future filtering, not that a verifiable SMTP/Sent record was found. + +## Pending send + +These are the two highest-priority upgrade candidates. Do not mark as sent until the upgrade email is actually sent. + +| Name | Email | Stage | Lead score | Reason | +| --- | --- | --- | ---: | --- | +| Ishemupenyu Chagonda | info@aldenadvisory.co.uk | Upgrade Candidate | 105 | User confirmed no upgrade email has been sent yet | +| Shreya Hegde | shhegde@linkedin.com | Upgrade Candidate | 95 | User confirmed no upgrade email has been sent yet | + +## Marked as sent by manual memory + +These contacts should be treated as already sent when filtering future upgrade-nudge batches. + +| Name | Email | Stage | Lead score | Status | +| --- | --- | --- | ---: | --- | +| Marcos Pagan | marcos@easternalliancerealty.com | Upgrade Candidate | 80 | sent_assumed_manual | +| katie Loucaides | katie.loucaides@rya.org.uk | Upgrade Candidate | 70 | sent_assumed_manual | +| Lindsey Holtz | lholtz@uwhealth.org | Upgrade Candidate | 70 | sent_assumed_manual | +| Janell Elder | janell.elder@gov.sk.ca | Upgrade Candidate | 70 | sent_assumed_manual | +| Nouf Saud | nouna.1428@gmail.com | Hot | 65 | sent_assumed_manual | +| Richie Shawl | richie.shawl@alfalaval.com | Hot | 60 | sent_assumed_manual | +| Patricia Hartmann | patricia.hartmann@agderfk.no | Hot | 60 | sent_assumed_manual | +| Andreas Knuth | andreas.knuth@gmail.com | Hot | unknown | sent_assumed_manual | + +## Excluded + +| Name | Email | Stage | Reason | +| --- | --- | --- | --- | +| Profoto Malaysia Sdn Bhd | profotomalaysia@gmail.com | Paid | Already PRO/Paid, not an upgrade-nudge target | + +## Notes + +- IMAP `Sent` check on 2026-05-02 found no verifiable Day-7 upgrade-nudge email records. +- The currently configured database lacks the `upgradeNudgeSentAt` column, so app-level sent status could not be verified there. +- Future upgrade-nudge sends should prioritize `info@aldenadvisory.co.uk` and `shhegde@linkedin.com`. diff --git a/src/app/(main)/(marketing)/about/page.tsx b/src/app/(main)/(marketing)/about/page.tsx index 2b3375e..ddf86b4 100644 --- a/src/app/(main)/(marketing)/about/page.tsx +++ b/src/app/(main)/(marketing)/about/page.tsx @@ -8,11 +8,11 @@ import { CheckCircle2, Shield, Users, BarChart3, Globe, Lock } from 'lucide-reac import { ObfuscatedMailto } from '@/components/ui/ObfuscatedMailto'; export const metadata: Metadata = { - title: 'About QR Master | The Team & Mission Behind the Platform', - description: 'QR Master is built for measurable campaigns and secure QR code operations. Learn about our mission, values, and why businesses trust us.', + title: 'About QR Master | Free QR Code Generator for Businesses', + description: 'QR Master helps businesses create, track, and manage QR codes at scale — free dynamic QR codes, real analytics, and no hidden limits. Learn who we are.', openGraph: { - title: 'About QR Master | Dynamic QR Codes & Analytics', - description: 'We help businesses create, manage, and track QR codes at scale. Transparent pricing, privacy-first, and built for reliability.', + title: 'About QR Master | Free Dynamic QR Codes & Analytics', + description: 'Free dynamic QR codes with scan analytics, custom branding, and no reprint headaches. Learn about the team and mission behind QR Master.', url: 'https://www.qrmaster.net/about', type: 'website', images: ['/og-image.png'], @@ -112,11 +112,11 @@ export default function AboutPage() { -
- Create QR codes you can update after printing. Change the destination later, - review scan context, and keep printed materials useful for longer. -
-- Same QR image, different destination later. -
-- Dynamic QR is the better fit when the destination may change after the printed code is already in use. -
-{item.feature}
-- These are the core product benefits verified by the current QR Master flows and plan limits. -
-{feature.description}
-- Use dynamic QR where the destination may evolve after the printed material is already deployed. -
-{useCase.description}
-- Example: {useCase.example} -
-- The ability to update destinations after printing — and track every scan — transforms a static print asset into a measurable marketing channel. -
- -- Companies with strong omnichannel customer engagement — enabled by closed-loop tracking from offline to online — retain 89% of their customers, compared to only 33% for companies with weak omnichannel engagement. -
-- Source: Aberdeen Group — Omnichannel Customer Engagement Study -
-- of small businesses report printing and direct mail errors as a major source of wasted marketing budget. Dynamic QR codes eliminate this risk — update the destination, never reprint. -
-- Source: Data & Marketing Association (DMA) -
-- By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research -
-- Dynamic QR codes — where the destination URL can be changed after printing — are offered by several platforms. Here is how they compare on price, privacy, and use case fit. -
- -| Service | -Free plan | -Paid from | -GDPR | -Bulk creation | -Best for | -
|---|---|---|---|---|---|
| - {row.highlight ? ( - - {row.service} - This site - - ) : ( - row.service - )} - | -{row.freePlan} | -{row.paidFrom} | -{row.gdpr} | -{row.bulk} | -{row.bestFor} | -
- Last updated: April 2026. Pricing may change — verify on each provider's website before purchasing. Beaconstac rebranded to Uniqode in 2023. -
-- Use one QR code that can keep working even when the destination behind it needs to change. -
-+ Create editable QR codes you can update after printing. + Change the destination later, track scans, and keep flyers, + menus, packaging, and business cards useful for longer. +
++ Same QR image, different destination later. +
++ Editable QR code workflow +
++ A static QR code locks the final URL into the image. A dynamic + QR code generator creates a short managed link first, so QR + Master can redirect scanners to the current destination, record + scan analytics, and let you edit the destination later. +
++ Update campaign URLs, menu PDFs, support pages, or booking + links from the dashboard while the same printed QR code keeps + working. +
++ Review scan time, device, and location context so offline + materials become measurable instead of invisible. +
++ Use one editable QR code across flyers, signs, packaging, + event badges, or business cards when the destination may + change. +
++ Dynamic QR is the better fit when the destination may change + after the printed code is already in use. +
++ {item.feature} +
++ These are the core product benefits verified by the current QR + Master flows and plan limits. +
+{feature.description}
++ Use dynamic QR where the destination may evolve after the + printed material is already deployed. +
+{useCase.description}
++ Example: {useCase.example} +
++ The ability to update destinations after printing — and track + every scan — transforms a static print asset into a measurable + marketing channel. +
+ ++ Companies with strong omnichannel customer engagement — + enabled by closed-loop tracking from offline to online — + retain 89% of their customers, compared to + only 33% for companies with weak omnichannel engagement. +
++ Source:{' '} + + Aberdeen Group + {' '} + — Omnichannel Customer Engagement Study +
++ of small businesses report printing and direct mail errors as + a major source of wasted marketing budget. Dynamic QR codes + eliminate this risk — update the destination, never reprint. +
++ Source:{' '} + + Data & Marketing Association (DMA) + +
++ By Timo Knuth, QR Master - Last updated: May 2026 - Based on + independent academic and industry research +
++ Dynamic QR codes — where the destination URL can be changed after + printing — are offered by several platforms. Here is how they + compare on price, privacy, and use case fit. +
+ +| + Service + | ++ Free plan + | ++ Paid from + | ++ GDPR + | ++ Bulk creation + | ++ Best for + | +
|---|---|---|---|---|---|
| + {row.highlight ? ( + + {row.service} + + This site + + + ) : ( + row.service + )} + | ++ {row.freePlan} + | ++ {row.paidFrom} + | +{row.gdpr} | +{row.bulk} | +{row.bestFor} | +
+ Last updated: May 2026. Pricing may change - verify on each + provider's website before purchasing. Beaconstac rebranded to + Uniqode in 2023. +
++ Use one QR code that can keep working even when the destination + behind it needs to change. +
+- Create professional QR codes for your business with QR Master. Our dynamic QR code generator - lets you create trackable QR codes, edit destinations anytime, and view detailed analytics. - Perfect for restaurants, retail, events, and marketing campaigns. -
-- Features include: Dynamic QR codes with real-time tracking, bulk QR code generation from Excel/CSV, - custom branding with colors and logos, advanced scan analytics showing device types and locations, - vCard QR codes for digital business cards, restaurant menu QR codes, and a free{' '} - barcode generator for EAN-13, UPC-A, and Code 128 barcodes. -
-- Start free with 3 active dynamic QR codes and unlimited static codes. Upgrade to Pro for 50 codes - with advanced analytics, or Business for 500 codes with bulk creation and priority support. -
-+ Create professional QR codes for your business with QR Master. Our + dynamic QR code generator lets you create trackable QR codes, edit + destinations anytime, and view detailed analytics. Perfect for + restaurants, retail, events, and marketing campaigns. +
++ Features include: Dynamic QR codes with real-time tracking, bulk QR + code generation from Excel/CSV, custom branding with colors and logos, + advanced scan analytics showing device types and locations, vCard QR + codes for digital business cards, restaurant menu QR codes, and a free{' '} + barcode generator for EAN-13, + UPC-A, and Code 128 barcodes. +
++ Popular QR Master workflows include the{' '} + + free dynamic QR code generator + + , QR code tracking, and the{' '} + custom QR code generator for + branded print campaigns. +
++ Start free with 3 active dynamic QR codes and unlimited static codes. + Upgrade to Pro for 50 codes with advanced analytics, or Business for + 500 codes with bulk creation and priority support. +
+- Use dynamic QR codes to measure scans by time, device, and location context, - so printed campaigns and physical placements stop being guesswork. -
-- These are the analytics surfaces the current product experience already supports without inventing extra claims. -
-{feature.description}
-- Tracking is a dynamic QR workflow, not a static QR workflow with retroactive reporting. -
-| Capability | -Static QR | -Dynamic QR tracking | -
|---|---|---|
| {row.feature} | -{row.static ? 'Yes' : 'No'} | -- {row.dynamic ? 'Yes' : 'No'} - | -
- Use tracking where physical surfaces or campaigns need measurable follow-through after they are deployed. -
-{useCase.description}
-- Without scan analytics, a printed QR code is invisible — you can't tell if your campaign placement is working. Tracking turns every scan into actionable data. -
- -- Companies with strong omnichannel engagement — requiring closed-loop tracking from offline to online — retain 89% of their customers, compared to 33% for businesses without integrated tracking. -
-- Source: Aberdeen Group — Omnichannel Customer Engagement Study -
-- of small businesses identify print and direct mail errors as a major source of wasted marketing budget. QR tracking reveals which placements actually drive scans — so you reprint only what works. -
-- Source: Data & Marketing Association (DMA) -
-- By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research -
-- Measure scans with enough context to improve the next placement, campaign, or printed workflow. -
-+ Track QR code scans by time, device, and location context + with dynamic QR codes, so printed campaigns and physical + placements stop being guesswork. +
++ Scan analytics workflow +
++ Create a dynamic QR code for each placement you want to measure, + label it by channel or surface, then compare scan activity from + the dashboard. This gives each flyer, sign, menu, package + insert, or event material its own measurable scan record. +
++ Use a dynamic QR code for each important placement so scans + route through QR Master before visitors reach the final page. +
++ Name codes by campaign, surface, location, or print batch so + the analytics stay useful when traffic starts coming in. +
++ Review total scans, unique scans, devices, time patterns, and + location context to decide which printed placements deserve + more budget. +
++ These are the analytics surfaces the current product experience + already supports without inventing extra claims. +
+{feature.description}
++ Tracking is a dynamic QR workflow, not a static QR workflow with + retroactive reporting. +
+| + Capability + | ++ Static QR + | ++ Dynamic QR tracking + | +
|---|---|---|
| + {row.feature} + | ++ {row.static ? 'Yes' : 'No'} + | ++ {row.dynamic ? 'Yes' : 'No'} + | +
+ Use tracking where physical surfaces or campaigns need + measurable follow-through after they are deployed. +
+{useCase.description}
++ Without scan analytics, a printed QR code is invisible — you can't + tell if your campaign placement is working. Tracking turns every + scan into actionable data. +
+ ++ Companies with strong omnichannel engagement — requiring + closed-loop tracking from offline to online — retain{' '} + 89% of their customers, compared to 33% for + businesses without integrated tracking. +
++ Source:{' '} + + Aberdeen Group + {' '} + — Omnichannel Customer Engagement Study +
++ of small businesses identify print and direct mail errors as a + major source of wasted marketing budget. QR tracking reveals + which placements actually drive scans — so you reprint only + what works. +
++ Source:{' '} + + Data & Marketing Association (DMA) + +
++ By Timo Knuth, QR Master - Last updated: May 2026 - Based on + independent academic and industry research +
++ Measure scans with enough context to improve the next placement, + campaign, or printed workflow. +
+- By Timo Knuth, QR Master · Last updated: April 2026 · GS1-verified content + By Timo Knuth, QR Master · Last updated: May 2026 · GS1-verified content
diff --git a/src/app/(main)/(marketing)/tools/barcode-generator/page.tsx b/src/app/(main)/(marketing)/tools/barcode-generator/page.tsx
index 0f15de1..6e56194 100644
--- a/src/app/(main)/(marketing)/tools/barcode-generator/page.tsx
+++ b/src/app/(main)/(marketing)/tools/barcode-generator/page.tsx
@@ -1,382 +1,573 @@
-
-import React from 'react';
-import type { Metadata } from 'next';
-import BarcodeGeneratorClient from './BarcodeGeneratorClient';
-import { BarcodeGuide } from './BarcodeGuide';
-import { Barcode as BarcodeIcon, Shield, Zap, Printer, Download, Share2, Sparkles, Sliders, Check } from 'lucide-react';
-import { ToolBreadcrumb } from '@/components/seo/BreadcrumbSchema';
-import { RelatedTools } from '@/components/marketing/RelatedTools';
-import { generateSoftwareAppSchema, generateFaqSchema } from '@/lib/schema-utils';
-
-// SEO Optimized Metadata
-export const metadata: Metadata = {
- title: {
- absolute: 'Free Barcode Generator Online – EAN, UPC, Code 128',
- },
- description: 'Free online barcode generator for EAN-13, UPC-A, and Code 128 barcodes. Create scannable labels for retail, inventory, and logistics instantly. Download PNG or SVG — no signup required.',
- keywords: ['barcode generator', 'online barcode maker', 'create barcode free', 'ean-13 generator', 'upc-a generator', 'code 128 generator', 'barcode creator', 'printable barcodes'],
- alternates: {
- canonical: 'https://www.qrmaster.net/tools/barcode-generator',
- languages: {
- 'x-default': 'https://www.qrmaster.net/tools/barcode-generator',
- en: 'https://www.qrmaster.net/tools/barcode-generator',
- },
- },
- openGraph: {
- title: 'Barcode Generator: Create EAN, UPC & Code 128',
- description: 'Barcode Generator: Create professional labels instantly. Free & Secured.',
- url: 'https://www.qrmaster.net/tools/barcode-generator',
- siteName: 'QR Master',
- locale: 'en_US',
- type: 'website',
- images: [{ url: '/barcode-generator-preview.png', width: 1200, height: 630 }],
- },
- twitter: {
- card: 'summary_large_image',
- title: 'Free Barcode Generator',
- description: 'Create custom barcodes in seconds. Download high-quality PNG/SVG.',
- },
- robots: {
- index: true,
- follow: true,
- },
-};
-
-// JSON-LD Structured Data
-const jsonLd = {
- '@context': 'https://schema.org',
- '@graph': [
- generateSoftwareAppSchema(
- 'Barcode Generator',
- 'Generate custom printable barcodes instantly for EAN, UPC, Code 128 and more.',
- '/barcode-generator-preview.png',
- 'UtilitiesApplication'
- ),
- {
- '@type': 'WebPage',
- '@id': 'https://www.qrmaster.net/tools/barcode-generator',
- name: 'Free Barcode Generator Online – EAN, UPC, Code 128',
- description: 'A barcode generator converts any number or text into a scannable barcode image for retail labels, inventory, and product packaging. Supports EAN-13, UPC-A, and Code 128.',
- speakable: {
- '@type': 'SpeakableSpecification',
- cssSelector: ['.bg-blue-50', 'h1'],
- },
- author: {
- '@type': 'Person',
- name: 'Timo Knuth',
- url: 'https://www.qrmaster.net/authors/timo',
- },
- dateModified: '2026-04-27',
- },
- {
- '@type': 'HowTo',
- name: 'How to Create a Barcode',
- datePublished: '2024-06-01',
- dateModified: '2026-04-27',
- author: {
- '@type': 'Person',
- name: 'Timo Knuth',
- url: 'https://www.qrmaster.net/authors/timo',
- },
- description: 'Create custom barcodes for products or inventory.',
- step: [
- {
- '@type': 'HowToStep',
- position: 1,
- name: 'Enter Content',
- text: 'Type or paste the numeric or alphanumeric data for your barcode.',
- },
- {
- '@type': 'HowToStep',
- position: 2,
- name: 'Select Format',
- text: 'Choose the appropriate barcode type (e.g., Code 128 for general use, EAN-13 for retail).',
- },
- {
- '@type': 'HowToStep',
- position: 3,
- name: 'Customize Design',
- text: 'Adjust the height and width of the barcode to fit your needs.',
- },
- {
- '@type': 'HowToStep',
- position: 4,
- name: 'Toggle Text',
- text: 'Decide if you want the human-readable value to appear below the barcode.',
- },
- {
- '@type': 'HowToStep',
- position: 5,
- name: 'Download & Print',
- text: 'Save your barcode as PNG or SVG and print it for labels or inventory.',
- },
- ],
- totalTime: 'PT20S',
- },
- generateFaqSchema({
- 'What is a Barcode Generator?': {
- question: 'What is a Barcode Generator?',
- answer: 'A Barcode Generator is an online tool that converts numbers or text into scannable barcode images that can be used for products, labels, and inventory systems.',
- },
- 'Is this barcode generator free to use?': {
- question: 'Is this barcode generator free to use?',
- answer: 'Yes, our online barcode generator is completely free to use with no hidden costs or sign-ups required. You can generate, download, and print barcodes instantly.',
- },
- 'Which barcode format should I use?': {
- question: 'Which barcode format should I use?',
- answer: 'EAN-13 is standard for retail in Europe/Global. UPC-A is standard for retail in USA/Canada. Code 128 is best for logistics and internal tracking as it supports letters and numbers.',
- },
- 'Can I download barcodes in vector format (SVG)?': {
- question: 'Can I download barcodes in vector format (SVG)?',
- answer: 'Yes! We offer SVG downloads. SVG files are vector-based, meaning they can be scaled to any size without losing quality—perfect for professional product packaging.',
- },
- 'How do I generate a barcode online?': {
- question: 'How do I generate a barcode online?',
- answer: 'To generate a barcode online, enter your product number or text, select the desired barcode format (such as EAN-13 or Code 128), and click the generate button. The barcode will be created instantly.',
- },
- 'Are generated barcodes scannable?': {
- question: 'Are generated barcodes scannable?',
- answer: 'Yes, barcodes generated with a proper barcode generator are fully scannable. We generate standard-compliant barcodes readable by any standard optical or laser barcode scanner.',
- },
- 'Can I use these barcodes for Amazon (EAN/UPC)?': {
- question: 'Can I use these barcodes for Amazon (EAN/UPC)?',
- answer: 'You can generate the image for Amazon here if you already have your EAN/UPC number. However, you cannot "create" a valid global EAN number here—you must purchase those official numbers from GS1 to sell on major platforms like Amazon.',
- },
- 'What is the difference between a barcode and a QR code?': {
- question: 'What is the difference between a barcode and a QR code?',
- answer: 'A barcode stores data horizontally (1D) and is mainly used for product IDs. A QR code stores data in 2D (matrix) and can hold much more information, such as URLs, vCards, or WiFi credentials.',
- },
- }),
- ],
-};
-
-export default function BarcodeGeneratorPage() {
- return (
- <>
-
-
- A barcode generator converts any number or text into a scannable barcode image — ready to download, print, and use on products, labels, or inventory systems. - Supports EAN-13, UPC-A, and Code 128. No signup required. -
- -- A barcode generator is an online tool that converts a number or text string into a scannable barcode image (EAN-13, UPC-A, or Code 128). The generated barcode can be downloaded as PNG or SVG and printed on product labels, packaging, or inventory stickers for use with any standard barcode scanner. -
-✓ Use a barcode for:
-✓ Use a QR code for:
-- Enter your data and select the format. -
-- Adjust height, width and text display. -
-- See your barcode update in real-time. -
-- Save as professional PNG or SVG. -
-- Print labels directly from your browser. -
-+ A free custom barcode generator and{' '} + barcode maker for EAN-13, UPC-A, UPC barcodes, + and Code 128. Convert any number or text into a scannable + barcode, download PNG or SVG, print instantly, no signup + required. +
+ ++ A custom barcode generator is an online tool + that converts a number or text string into a scannable barcode + image (EAN-13, UPC-A, or Code 128). The generated barcode can be + downloaded as PNG or SVG and printed on product labels, + packaging, or inventory stickers for use with any standard + barcode scanner. +
++ ✓ Use a barcode for: +
++ ✓ Use a QR code for: +
++ Enter your data and select the format. +
++ Adjust height, width and text display. +
++ See your barcode update in real-time. +
++ Save as professional PNG or SVG. +
++ Print labels directly from your browser. +
++ Custom barcode generator +
++ Use the barcode maker when you already have a product number, + SKU, inventory ID, or internal reference and need a printable + barcode image. Choose the format, adjust the dimensions, show or + hide the text value, then export a clean PNG or SVG for labels. +
++ Generate EAN-13 or UPC-A barcode images for packaging and + shelf labels when you already have valid GS1-issued numbers. +
++ Use Code 128 for alphanumeric SKUs, warehouse bins, assets, + and internal tracking labels that need scanner-friendly codes. +
++ Download SVG for crisp print layouts or PNG for fast use in + docs, product sheets, and simple label workflows. +
++ Need a code for a web page instead of a retail scanner? Use the{' '} + + dynamic QR code generator + {' '} + if the destination may change later, or the{' '} + + QR code tracking + {' '} + workflow when you need scan analytics. +
+- Generate static QR codes for any purpose. No credit card, no expiration, no hidden fees. -
-- We believe basic QR codes should be accessible to everyone. Our static QR codes encode your data directly into the image, - meaning we don't need to host tracking servers for them. That's why they are free forever. - If you need tracking and editability, check out our Dynamic QR Codes. -
-+ Generate static QR codes for any purpose. No credit card, no + expiration, no hidden fees. +
++ We believe basic QR codes should be accessible to everyone. Our + static QR codes encode your data directly into the image, meaning we + don't need to host tracking servers for them. That's why they are + free forever. If you need tracking and editability, use our{' '} + + dynamic QR code generator + {' '} + or learn how{' '} + + QR code tracking + {' '} + works. +
+Ready to create one?
+Use the free vCard QR Code Generator — no signup required, works on iPhone and Android.
+ Create your vCard QR Code → +A vCard (Virtual Contact File) QR code contains your contact information in a standardized format (.vcf). When someone scans it with their smartphone camera, they can instantly save your details to their contacts—no typing required.
+A vCard (Virtual Contact File) QR code contains your contact information in a standardized format (.vcf). When someone scans it with their smartphone camera, they can instantly save your details to their contacts — no typing required. It replaces the friction of spelling out a phone number or email at a networking event with a single tap.
+The QR code encodes a VCF data string directly. That string includes fields like name, phone, email, company, job title, website, and LinkedIn. When the phone's camera reads the code, it parses the VCF and offers to add the contact in one tap.
+ +This is the most important choice you'll make.
+Recommendation: Use dynamic if you might change jobs, switch numbers, or want to track engagement. Use static if you just need a simple one-time contact share.
+The QR Master vCard generator supports both — static for simplicity, dynamic for flexibility and tracking.
+ +Less is more. Include the fields people actually need to follow up with you:
+Avoid adding multiple phone numbers or social handles unless you have a specific reason — cluttered vCards confuse the contact save prompt on some phones.
+ +Yes. The native iOS camera app reads QR codes and prompts to add the contact directly via the VCF format. No app needed.
+Yes. The Google Lens camera and most Android manufacturer camera apps support VCF QR codes natively. The contact save prompt appears automatically after scanning.
+The VCF format supports embedding a photo, but the encoded QR code becomes very large (and harder to scan) with a full photo. It's better to skip the photo in the vCard itself and put your headshot next to the QR code on the business card instead.
+SVG for print — it scales to any size with no pixelation. PNG at 300 DPI for digital sharing.
+ +Free, no signup required. Download in SVG or PNG. Works on iPhone and Android.
+ Open the free vCard generator → +Bottom line up front
+QR Master is the best free option for businesses in 2026 — free dynamic QR codes, real scan analytics, SVG export, and no scan limits. No credit card required. Try it free →
+The best QR code generator 2026 depends on one thing: what you need the QR code to do after it's printed. For casual use, almost any generator works. For marketing and business, the best tools share a set of capabilities: dynamic QR codes, tracking, reliable redirects, branding, and management features.
- -This guide gives you a "choose the right tool" checklist and a practical breakdown of common options — without forcing you into one single pick.
-Zapier's QR guide, for example, points out that different generators shine in different areas (business features, design customization, tracking).
+The best QR code generator in 2026 depends on one thing: what you need the QR code to do after it's printed. For casual use, almost any generator works. For marketing and business, the best tools share a core set of capabilities: dynamic QR codes, tracking, reliable redirects, branding, and management features.
+ +This guide gives you a side-by-side comparison of the top tools and a practical checklist — so you can pick the right one for your exact use case without having to sign up for five free trials first.
According to Statista, approx. 45% of shoppers scanned a QR code in the past month, while QR code generation jumped 238% from 2021-2023 (Uniqode). With this explosive growth, choosing the right generator is more important than ever.
diff --git a/src/lib/industry-pages.ts b/src/lib/industry-pages.ts index b5c8547..3b2b5f0 100644 --- a/src/lib/industry-pages.ts +++ b/src/lib/industry-pages.ts @@ -37,7 +37,7 @@ export const allIndustries: IndustryPage[] = [ name: "Restaurants", title: "QR Codes for Restaurants", metaTitle: "QR Codes for Restaurants: Update Your Menu Without Reprinting", - metaDescription: "Simplify restaurant operations with QR codes for digital menus, contactless ordering, payments, customer feedback, and loyalty offers.", + metaDescription: "Simplify restaurant operations with QR codes for digital menus, contactless ordering, payments, customer feedback, and loyalty offers.", headline: "QR Codes for Restaurants: Update Your Menu Without Reprinting", subheadline: "Reduce printing costs by up to $5,000 per year while enabling contactless ordering and real-time menu updates", heroImage: "/marketing/industries/restaurants.png", @@ -75,8 +75,8 @@ export const allIndustries: IndustryPage[] = [ slug: "cafes", name: "Cafes", title: "QR Codes for Cafes", - metaTitle: "QR Codes for Cafes: Menus & Loyalty", - metaDescription: "Enhance the cafe experience with QR codes for digital menus, loyalty programs, takeaway orders, feedback collection, and social engagement.", + metaTitle: "QR Codes for Cafes: Menus & Loyalty", + metaDescription: "Enhance the cafe experience with QR codes for digital menus, loyalty programs, takeaway orders, feedback collection, and social engagement.", headline: "QR Codes for Cafes: Streamline Orders and Build Customer Loyalty", subheadline: "Create seamless ordering experiences while collecting feedback and promoting your social channels - all from one scannable code", heroImage: "/marketing/industries/cafes.png", @@ -99,7 +99,7 @@ export const allIndustries: IndustryPage[] = [ ], tools: ["url-qr-code", "wifi-qr-code", "sms-qr-code"], faq: [ - { question: "Are QR codes cost-effective for small cafes?", answer: "Yes! They eliminate menu reprinting costs, reduce paper waste, and many generators offer free basic plans." }, + { question: "Are QR codes cost-effective for small cafes?", answer: "Yes! They eliminate menu reprinting costs, reduce paper waste, and many generators offer free basic plans. For a step-by-step menu setup, see the Restaurant Menu QR Code Guide →" }, { question: "Can I use one QR code for multiple purposes?", answer: "Yes, with dynamic QR codes you can easily update the destination URL to serve different purposes over time." }, { question: "How do cafes engage customers with QR?", answer: "Cafes link QR codes to loyalty sign-ups, Instagram profiles, and feedback forms to build lasting relationships." } ], @@ -114,8 +114,8 @@ export const allIndustries: IndustryPage[] = [ slug: "hotels", name: "Hotels", title: "QR Codes for Hotels", - metaTitle: "QR Codes for Hotels: Check-In & Guest Info", - metaDescription: "Modernize hotel operations with QR codes for contactless check-in, digital room guides, amenity bookings, WiFi access, and guest feedback.", + metaTitle: "QR Codes for Hotels: Check-In & Guest Info", + metaDescription: "Modernize hotel operations with QR codes for contactless check-in, digital room guides, amenity bookings, WiFi access, and guest feedback.", headline: "QR Codes for Hotels: Contactless Check-In and Guest Services", subheadline: "Streamline guest experiences from arrival to departure while reducing print costs and enabling instant information updates", heroImage: "/marketing/industries/hotels.png", @@ -154,7 +154,7 @@ export const allIndustries: IndustryPage[] = [ name: "Real Estate", title: "QR Codes for Real Estate", metaTitle: "QR Codes for Real Estate: Yard Signs to Virtual Tours", - metaDescription: "Transform property marketing with QR codes on yard signs and flyers that link to listings, virtual tours, disclosures, and agent contacts.", + metaDescription: "Transform property marketing with QR codes on yard signs and flyers that link to listings, virtual tours, disclosures, and agent contacts.", headline: "QR Codes for Real Estate: Yard Signs to Virtual Tours Instantly", subheadline: "Connect buyers to property listings, virtual tours, and agent info instantly - then update the destination when the property sells", heroImage: "/marketing/industries/real-estate.png", @@ -193,7 +193,7 @@ export const allIndustries: IndustryPage[] = [ name: "Gyms", title: "QR Codes for Gyms", metaTitle: "QR Codes for Gyms: Class Schedules and Tutorials", - metaDescription: "Enhance member experience with QR codes for check-in, class booking, equipment tutorials, app downloads, and loyalty programs.", + metaDescription: "Enhance member experience with QR codes for check-in, class booking, equipment tutorials, app downloads, and loyalty programs.", headline: "QR Codes for Gyms: Class Schedules and Equipment Guides", subheadline: "Enable contactless check-in, instant class bookings, and video equipment tutorials to improve member confidence and retention", heroImage: "/marketing/industries/gyms.png", @@ -232,7 +232,7 @@ export const allIndustries: IndustryPage[] = [ name: "Doctors & Dentists", title: "Doctors & Dentists", metaTitle: "QR Codes for Healthcare: HIPAA-Compliant Forms", - metaDescription: "Streamline healthcare visits with QR codes for digital intake forms, appointment booking, waiting room WiFi, and aftercare instructions.", + metaDescription: "Streamline healthcare visits with QR codes for digital intake forms, appointment booking, waiting room WiFi, and aftercare instructions.", headline: "QR Codes for Doctors & Dentists: HIPAA-Compliant Check-In", subheadline: "Reduce paperwork and wait times with digital intake forms, appointment scheduling, and aftercare instructions accessible by scan", heroImage: "/marketing/industries/doctors-dentists.png", @@ -270,7 +270,7 @@ export const allIndustries: IndustryPage[] = [ slug: "retail", name: "Retail", title: "QR Codes for Retail", - metaTitle: "QR Codes for Retail: Product Info & Payments", + metaTitle: "QR Codes for Retail: Product Info & Payments", metaDescription: "Boost retail engagement with product details, contactless payments, loyalty programs, and highly interactive window shopping.", headline: "QR Codes for Retail: Product Info & Loyalty Programs", subheadline: "Bridge your physical store and digital presence with instant product details, contactless checkout, and shoppable window displays", @@ -372,7 +372,7 @@ export const allIndustries: IndustryPage[] = [ ], tools: ["url-qr-code", "wifi-qr-code", "instagram-qr-code"], faq: [ - { question: "How do bars use QR codes for menus?", answer: "Dynamic QR codes on table tents or bar top stickers link to a digital menu page. When you update the page, the code stays the same." }, + { question: "How do bars use QR codes for menus?", answer: "Dynamic QR codes on table tents or bar top stickers link to a digital menu page. When you update the page, the code stays the same. See the full setup guide: Restaurant Menu QR Code Guide →" }, { question: "Can I show different menus for happy hour vs. regular hours?", answer: "Yes, with a dynamic QR code you can schedule URL redirects so the same physical code shows a happy hour menu during those specific hours." }, { question: "Where should bars place QR codes?", answer: "Table tents, bar top laminates, and bathroom mirrors are highest-traffic placements. Bathroom mirrors work especially well for event announcements." } ], @@ -426,7 +426,7 @@ export const allIndustries: IndustryPage[] = [ slug: "bakeries", name: "Bakeries", title: "QR Codes for Bakeries", - metaTitle: "QR Codes for Bakeries: Specials & Allergy Info", + metaTitle: "QR Codes for Bakeries: Specials & Allergy Info", metaDescription: "Share daily specials, allergen information, and loyalty programs with bakery QR codes. Update what's fresh without reprinting signs.", headline: "QR Codes for Bakeries: Daily Specials Without Daily Reprints", subheadline: "Tell customers what's fresh today, flag allergens clearly, and run a digital loyalty card - all from a single code on the display case", @@ -465,7 +465,7 @@ export const allIndustries: IndustryPage[] = [ slug: "breweries", name: "Breweries & Tap Rooms", title: "QR Codes for Breweries & Tap Rooms", - metaTitle: "QR Codes for Breweries: Tap List & Events", + metaTitle: "QR Codes for Breweries: Tap List & Events", metaDescription: "Give tap room visitors detailed tasting notes, brewing stories, and events calendars with QR codes. Update your tap list without reprinting menus.", headline: "QR Codes for Breweries: Rotating Taps, Zero Reprinting", subheadline: "Share detailed tasting notes and your current tap list in real time - then use the same code to promote your next release event", @@ -582,7 +582,7 @@ export const allIndustries: IndustryPage[] = [ slug: "wineries", name: "Wineries & Vineyards", title: "QR Codes for Wineries & Vineyards", - metaTitle: "QR Codes for Wineries: Labels & Tastings", + metaTitle: "QR Codes for Wineries: Labels & Tastings", metaDescription: "Enhance the wine experience with QR codes on bottle labels linking to tasting notes, vintage stories, food pairings, and cellar door bookings.", headline: "QR Codes for Wineries: The Full Story Behind Every Bottle", subheadline: "Put tasting notes, vintage stories, and cellar door booking links on every bottle label - without crowding the design", @@ -660,7 +660,7 @@ export const allIndustries: IndustryPage[] = [ slug: "spas", name: "Spas & Wellness Centers", title: "QR Codes for Spas & Wellness Centers", - metaTitle: "QR Codes for Spas: Booking & Gift Cards", + metaTitle: "QR Codes for Spas: Booking & Gift Cards", metaDescription: "Elevate the spa experience with QR codes for digital treatment menus, online booking, gift card purchases, and post-visit reviews.", headline: "QR Codes for Spas: Treatment Menus and Booking Without Phone Tag", subheadline: "Let clients browse treatments, book appointments, and purchase gift cards from their phone - without waiting on hold", @@ -724,7 +724,7 @@ export const allIndustries: IndustryPage[] = [ tools: ["url-qr-code", "instagram-qr-code", "vcard-qr-code"], faq: [ { question: "How do beauty salons use QR codes to get more bookings?", answer: "A QR code on the station mirror or checkout counter links directly to the booking platform. Clients rebook while still at the salon, capturing high-intent conversions." }, - { question: "Can a QR code replace a printed price list at a salon?", answer: "Yes, link a QR to your service menu page. When prices change, update the page - the physical QR code never needs to be reprinted." }, + { question: "Can a QR code replace a printed price list at a salon?", answer: "Yes, link a QR to your service menu page. When prices change, update the page — the physical QR code never needs to be reprinted. The same principle applies across hospitality: see how restaurants handle this →" }, { question: "What social platform should beauty salon QR codes link to?", answer: "Instagram is the strongest platform for beauty salons because transformation photos and styling reels perform extremely well there." } ], placementTips: [ @@ -972,7 +972,7 @@ export const allIndustries: IndustryPage[] = [ slug: "florists", name: "Florists & Flower Shops", title: "QR Codes for Florists & Flower Shops", - metaTitle: "QR Codes for Florists: Care Guides & Orders", + metaTitle: "QR Codes for Florists: Care Guides & Orders", metaDescription: "Grow your florist business with QR codes on delivery packaging linking to flower care guides, seasonal galleries, and repeat order links.", headline: "QR Codes for Florists: Care Instructions and Same-Day Reorders", subheadline: "Every bouquet you deliver becomes a future order - attach a QR linking to care tips, your gallery, and a one-click reorder page", @@ -1245,7 +1245,7 @@ export const allIndustries: IndustryPage[] = [ slug: "schools", name: "Schools", title: "QR Codes for Schools", - metaTitle: "QR Codes for Schools: Parent Links & Notices", + metaTitle: "QR Codes for Schools: Parent Links & Notices", metaDescription: "Improve parent communication and student access to resources with QR codes for school parent portals, homework links, event sign-ups, and notices.", headline: "QR Codes for Schools: Parent Portal Access Without the Password Panic", subheadline: "Give parents and students instant access to the school portal, homework, and notices - without lost letters and forgotten links", @@ -1284,7 +1284,7 @@ export const allIndustries: IndustryPage[] = [ slug: "museums", name: "Museums & Exhibitions", title: "QR Codes for Museums & Exhibitions", - metaTitle: "QR Codes for Museums: Audio Guides & Tours", + metaTitle: "QR Codes for Museums: Audio Guides & Tours", metaDescription: "Enrich visitor experience with QR codes for audio guides, detailed exhibit information, interactive content, and membership sign-ups.", headline: "QR Codes for Museums: Audio Guides and Expert Context for Every Exhibit", subheadline: "Replace expensive printed guides with QR codes that unlock rich exhibit stories, audio commentary, and multi-language support", @@ -1323,7 +1323,7 @@ export const allIndustries: IndustryPage[] = [ slug: "libraries", name: "Public Libraries", title: "QR Codes for Public Libraries", - metaTitle: "QR Codes for Libraries: Search & eBooks", + metaTitle: "QR Codes for Libraries: Search & eBooks", metaDescription: "Help library visitors find books, access digital resources, and discover events with QR codes for catalog search, eBook portals, and notice boards.", headline: "QR Codes for Libraries: Find Any Book Without Asking", subheadline: "Let visitors search the catalog, access eBooks, and register for events from any shelf or notice board in the building", @@ -1362,7 +1362,7 @@ export const allIndustries: IndustryPage[] = [ slug: "theaters", name: "Theaters & Performing Arts", title: "QR Codes for Theaters & Performing Arts", - metaTitle: "QR Codes for Theaters: Tickets & Programmes", + metaTitle: "QR Codes for Theaters: Tickets & Programmes", metaDescription: "Fill more seats and reduce printing costs with QR codes for theater ticket booking, digital season programmes, cast biographies, and interval offers.", headline: "QR Codes for Theaters: From Lobby Poster to Sold-Out Performance", subheadline: "Give theatergoers immediate access to ticket booking, digital programmes, and cast bios without a single printed booklet", @@ -1401,7 +1401,7 @@ export const allIndustries: IndustryPage[] = [ slug: "cinemas", name: "Cinemas & Movie Theaters", title: "QR Codes for Cinemas & Movie Theaters", - metaTitle: "QR Codes for Cinemas: Tickets & Loyalty", + metaTitle: "QR Codes for Cinemas: Tickets & Loyalty", metaDescription: "Speed up cinema entry and grow loyalty membership with QR codes for mobile tickets, showtimes, concession pre-ordering, and loyalty program sign-ups.", headline: "QR Codes for Cinemas: Mobile Tickets and No Queue Entry", subheadline: "Let moviegoers buy tickets, pre-order concessions, and join the loyalty program from a single scan at the foyer", @@ -1440,7 +1440,7 @@ export const allIndustries: IndustryPage[] = [ slug: "churches", name: "Churches & Places of Worship", title: "QR Codes for Churches & Places of Worship", - metaTitle: "QR Codes for Churches: Sermons & Donations", + metaTitle: "QR Codes for Churches: Sermons & Donations", metaDescription: "Engage congregation members and visitors with QR codes for sermon recordings, digital orders of service, online donations, and community event sign-ups.", headline: "QR Codes for Churches: Sermons, Donations, and Digital Orders of Service", subheadline: "Give visitors a way to access the service, donate, and stay connected without printing bulletins every week", @@ -1518,7 +1518,7 @@ export const allIndustries: IndustryPage[] = [ slug: "stadiums", name: "Stadiums & Sports Venues", title: "QR Codes for Stadiums & Sports Venues", - metaTitle: "QR Codes for Stadiums: Seat Maps & Merch", + metaTitle: "QR Codes for Stadiums: Seat Maps & Merch", metaDescription: "Enhance the fan experience at stadiums with QR codes for interactive seat maps, concession ordering, merchandise, and loyalty rewards.", headline: "QR Codes for Stadiums: Concessions, Maps, and Merchandise at Your Seat", subheadline: "Keep fans in their seats and boost per-cap spend with QR codes for ordering, navigation, and matchday information", @@ -1674,8 +1674,8 @@ export const allIndustries: IndustryPage[] = [ slug: "law-firms", name: "Law Firms", title: "QR Codes for Law Firms", - metaTitle: "QR Codes for Law Firms: Profiles & Booking", - metaDescription: "Build client trust with QR codes linking to attorney profiles, consultation booking, contact forms, and legal resource pages.", + metaTitle: "QR Codes for Law Firms: Profiles & Booking", + metaDescription: "Build client trust with QR codes linking to attorney profiles, consultation booking, contact forms, and legal resource pages.", headline: "QR Codes for Law Firms: Attorney Profiles and Consultation Booking", subheadline: "Every business card and client letter becomes a booking channel - one scan to attorney profiles, practice areas, and scheduling", heroImage: "/marketing/industries/law-firms.jpeg", @@ -1714,7 +1714,7 @@ export const allIndustries: IndustryPage[] = [ name: "Accounting Firms", title: "QR Codes for Accounting Firms", metaTitle: "QR Codes for Accountants: Document Portal & Tax Calendar", - metaDescription: "Streamline client communication with QR codes for secure document uploads, tax calendars, consultation booking, and office contact details.", + metaDescription: "Streamline client communication with QR codes for secure document uploads, tax calendars, consultation booking, and office contact details.", headline: "QR Codes for Accounting Firms: Secure Documents and Tax Deadlines", subheadline: "Give clients a direct link to your document portal, tax calendar, and booking page - all from a scan on your business card", heroImage: "/marketing/industries/accountants.jpeg", @@ -1908,7 +1908,7 @@ export const allIndustries: IndustryPage[] = [ slug: "airports", name: "Airports & Travel Hubs", title: "QR Codes for Airports & Travel Hubs", - metaTitle: "QR Codes for Airports: Gates, Maps & Check-In", + metaTitle: "QR Codes for Airports: Gates, Maps & Check-In", metaDescription: "Improve passenger experience at airports with QR codes for live flight status, interactive terminal maps, mobile check-in, and retail promotions.", headline: "QR Codes for Airports: Live Flight Status and Gate Maps at Every Sign", subheadline: "Point travelers to live departures, interactive maps, and mobile check-in directly from terminal signage - reducing queue pressure at information desks", @@ -1943,11 +1943,11 @@ export const allIndustries: IndustryPage[] = [ ], germanKeyword: "Flughäfen" }, - { - slug: "dentists", - name: "Dental Practices", - title: "QR Codes for Dental Practices", - metaTitle: "QR Codes for Dentists: Booking & Aftercare", + { + slug: "dentists", + name: "Dental Practices", + title: "QR Codes for Dental Practices", + metaTitle: "QR Codes for Dentists: Booking & Aftercare", metaDescription: "Modernize your dental practice with QR codes for appointment booking, treatment information, aftercare guides, and patient review collection.", headline: "QR Codes for Dental Practices: Appointments and Aftercare Without the Paperwork", subheadline: "Let patients book appointments, access treatment information, and receive post-procedure care instructions from a single scan", @@ -1979,94 +1979,94 @@ export const allIndustries: IndustryPage[] = [ "Waiting room table card for digital intake form and WiFi", "Small card given after treatment with aftercare QR", "Checkout counter display for Google review request" - ], - germanKeyword: "Zahnarztpraxen" - }, - { - slug: "pet-grooming", - name: "Pet Groomers", - title: "QR Codes for Pet Groomers", - metaTitle: "QR Codes for Pet Groomers: Online Booking & Portfolios", - metaDescription: "Grow your pet grooming business with QR codes for appointment booking, before-and-after portfolios, and digital business cards.", - headline: "QR Codes for Pet Groomers: Every Groom with a Digital Connection", - subheadline: "Let pet owners book appointments and view your portfolio with a simple scan on your card or window", - heroImage: "/marketing/industries/pet-grooming.jpeg", - statistics: [ - { value: "2x", label: "Higher Discovery-to-Session Conversion" }, - { value: "50%", label: "Reduction in Booking Phone Calls" }, - { value: "3x", label: "More Portfolio Views at Check-out" } - ], - benefits: [ - { title: "Zero-Hassle Online Booking", description: "Place a QR code on your business cards and window. Clients scan to see your availability and book their next grooming session in seconds." }, - { title: "Before-and-After Portfolios", description: "Show off your best work. Link QR codes in your lobby to a digital gallery of your latest dog and cat grooming transformations to build trust with new owners." }, - { title: "Pet Parent Resource Guides", description: "Give clients a QR code after their session that links to a PDF guide on home grooming tips and product recommendations between professional visits." } - ], - useCases: [ - "Online appointment booking and rescheduling", - "Digital before-and-after grooming portfolios", - "Home grooming care and product guides", - "Digital vCard for instant contact saving", - "Special offer and referral program links" - ], - tools: ["url-qr-code", "vcard-qr-code", "pdf-qr-code"], - faq: [ - { question: "How do pet groomers use QR codes for booking?", answer: "They place codes on business cards and their shop window that link directly to their booking software, reducing the need for phone tag." }, - { question: "Can I show a portfolio using a QR code?", answer: "Yes, you can link to an Instagram page or a dedicated gallery showing the dogs and cats you've groomed." }, - { question: "Where should groomers place QR codes?", answer: "The shop window, business cards, the checkout counter, and on grooming tags." } - ], - placementTips: [ - "Front window for after-hours booking", - "Professional business cards for vCard links", - "Lobby posters with before-and-after photo links" - ], - germanKeyword: "Hundefrisöre" - }, - { - slug: "veterinarians", - name: "Veterinarians", - title: "QR Codes for Veterinarians", - metaTitle: "QR Codes for Veterinarians: Health Records & Booking", - metaDescription: "Enhance veterinary care with QR codes for medical record access, appointment booking, emergency clinic details, and aftercare resources.", - headline: "QR Codes for Veterinarians: Improving Care and Communication", - subheadline: "Connect pet owners with medical records, booking portals, and emergency contacts instantly", - heroImage: "/marketing/industries/veterinarians.jpeg", - statistics: [ - { value: "50%", label: "Faster Access to Emergency Contact Info" }, - { value: "2x", label: "More Efficient Appointment Scheduling" }, - { value: "40%", label: "Better Digital Pet Health Record Usage" } - ], - benefits: [ - { title: "Digital Pet Health Records", description: "Give clients a QR code for their pet's collar tag or record folder. Scanning links directly to their up-to-date vaccination and medical history portals." }, - { title: "Instant Emergency Contacts", description: "Place a QR on your clinic window and business cards. In an emergency, pet owners scan for immediate dial-to-clinic and directions to the nearest 24-hour vet." }, - { title: "Seamless Post-Op Care Guides", description: "Replace paper instructions. After a procedure, provide a QR that links to a video or PDF explaining exactly how to care for their pet at home." } - ], - useCases: [ - "Digital pet health and vaccination records", - "Appointment booking and reminder portal", - "Emergency contact and location mapping", - "Post-operative care and medication guides", - "Pet insurance information and quote links" - ], - tools: ["url-qr-code", "call-qr-code-generator", "vcard-qr-code"], - faq: [ - { question: "How do vets use QR codes for emergencies?", answer: "They print codes that automatically dial the clinic or open a map to the nearest emergency animal hospital when scanned." }, - { question: "Can QR codes hold a pet's medical history?", answer: "They link to a secure portal where pet owners and other care providers can see the pet's latest records and vaccines." }, - { question: "Where should vet clinics place QR codes?", answer: "Lobby windows, medical record folders, and as a sticker on the back of the owner's business card." } - ], - placementTips: [ - "Medical folders for personal record links", - "Front door of the clinic for emergency info", - "Lobby posters for online booking registration" - ], - germanKeyword: "Tierärzte" - }, -]; + ], + germanKeyword: "Zahnarztpraxen" + }, + { + slug: "pet-grooming", + name: "Pet Groomers", + title: "QR Codes for Pet Groomers", + metaTitle: "QR Codes for Pet Groomers: Online Booking & Portfolios", + metaDescription: "Grow your pet grooming business with QR codes for appointment booking, before-and-after portfolios, and digital business cards.", + headline: "QR Codes for Pet Groomers: Every Groom with a Digital Connection", + subheadline: "Let pet owners book appointments and view your portfolio with a simple scan on your card or window", + heroImage: "/marketing/industries/pet-grooming.jpeg", + statistics: [ + { value: "2x", label: "Higher Discovery-to-Session Conversion" }, + { value: "50%", label: "Reduction in Booking Phone Calls" }, + { value: "3x", label: "More Portfolio Views at Check-out" } + ], + benefits: [ + { title: "Zero-Hassle Online Booking", description: "Place a QR code on your business cards and window. Clients scan to see your availability and book their next grooming session in seconds." }, + { title: "Before-and-After Portfolios", description: "Show off your best work. Link QR codes in your lobby to a digital gallery of your latest dog and cat grooming transformations to build trust with new owners." }, + { title: "Pet Parent Resource Guides", description: "Give clients a QR code after their session that links to a PDF guide on home grooming tips and product recommendations between professional visits." } + ], + useCases: [ + "Online appointment booking and rescheduling", + "Digital before-and-after grooming portfolios", + "Home grooming care and product guides", + "Digital vCard for instant contact saving", + "Special offer and referral program links" + ], + tools: ["url-qr-code", "vcard-qr-code", "pdf-qr-code"], + faq: [ + { question: "How do pet groomers use QR codes for booking?", answer: "They place codes on business cards and their shop window that link directly to their booking software, reducing the need for phone tag." }, + { question: "Can I show a portfolio using a QR code?", answer: "Yes, you can link to an Instagram page or a dedicated gallery showing the dogs and cats you've groomed." }, + { question: "Where should groomers place QR codes?", answer: "The shop window, business cards, the checkout counter, and on grooming tags." } + ], + placementTips: [ + "Front window for after-hours booking", + "Professional business cards for vCard links", + "Lobby posters with before-and-after photo links" + ], + germanKeyword: "Hundefrisöre" + }, + { + slug: "veterinarians", + name: "Veterinarians", + title: "QR Codes for Veterinarians", + metaTitle: "QR Codes for Veterinarians: Health Records & Booking", + metaDescription: "Enhance veterinary care with QR codes for medical record access, appointment booking, emergency clinic details, and aftercare resources.", + headline: "QR Codes for Veterinarians: Improving Care and Communication", + subheadline: "Connect pet owners with medical records, booking portals, and emergency contacts instantly", + heroImage: "/marketing/industries/veterinarians.jpeg", + statistics: [ + { value: "50%", label: "Faster Access to Emergency Contact Info" }, + { value: "2x", label: "More Efficient Appointment Scheduling" }, + { value: "40%", label: "Better Digital Pet Health Record Usage" } + ], + benefits: [ + { title: "Digital Pet Health Records", description: "Give clients a QR code for their pet's collar tag or record folder. Scanning links directly to their up-to-date vaccination and medical history portals." }, + { title: "Instant Emergency Contacts", description: "Place a QR on your clinic window and business cards. In an emergency, pet owners scan for immediate dial-to-clinic and directions to the nearest 24-hour vet." }, + { title: "Seamless Post-Op Care Guides", description: "Replace paper instructions. After a procedure, provide a QR that links to a video or PDF explaining exactly how to care for their pet at home." } + ], + useCases: [ + "Digital pet health and vaccination records", + "Appointment booking and reminder portal", + "Emergency contact and location mapping", + "Post-operative care and medication guides", + "Pet insurance information and quote links" + ], + tools: ["url-qr-code", "call-qr-code-generator", "vcard-qr-code"], + faq: [ + { question: "How do vets use QR codes for emergencies?", answer: "They print codes that automatically dial the clinic or open a map to the nearest emergency animal hospital when scanned." }, + { question: "Can QR codes hold a pet's medical history?", answer: "They link to a secure portal where pet owners and other care providers can see the pet's latest records and vaccines." }, + { question: "Where should vet clinics place QR codes?", answer: "Lobby windows, medical record folders, and as a sticker on the back of the owner's business card." } + ], + placementTips: [ + "Medical folders for personal record links", + "Front door of the clinic for emergency info", + "Lobby posters for online booking registration" + ], + germanKeyword: "Tierärzte" + }, +]; export const industryPages = Array.from( new Map(allIndustries.map((page) => [page.slug, page])).values() -); - -export function getIndustryPage(slug: string): IndustryPage | undefined { - return industryPages.find((p) => p.slug === slug); -} +); + +export function getIndustryPage(slug: string): IndustryPage | undefined { + return industryPages.find((p) => p.slug === slug); +}