Skip to content

feat: add app icon favicon to landing page #13

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
0xNyk merged 2 commits into from
Mar 3, 2026
Merged

feat: add app icon favicon to landing page #13

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
21a7819
feat: add app icon favicon to landing page
0xNyk Mar 3, 2026
510f280
feat: add logo and optimize landing conversion flow
0xNyk Mar 3, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added landing/apple-touch-icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added landing/favicon-32x32.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
36 changes: 31 additions & 5 deletions landing/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,17 +8,31 @@
name="description"
content="Dictx is local-first desktop speech-to-text. Dictx Pro gives you signed binaries and in-app auto-updates."
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="./favicon-32x32.png"
/>
<link
rel="apple-touch-icon"
sizes="128x128"
href="./apple-touch-icon.png"
/>
<link rel="stylesheet" href="./styles.css" />
</head>
<body>
<div class="noise"></div>
<header class="nav shell">
<a class="wordmark" href="#top" aria-label="Dictx home">Dictx</a>
<a class="brand" href="#top" aria-label="Dictx home">
<img src="./logo.png" class="brand-icon" alt="Dictx logo" />
<span class="wordmark">Dictx</span>
</a>
<nav class="menu" aria-label="Primary">
<a href="#features">Features</a>
<a href="#pricing">Pricing</a>
<a
href="https://github.com/0xNyk/dictx"
href="https://github.com/splitlabs/dictx"
target="_blank"
rel="noreferrer"
>GitHub</a
Expand All @@ -30,16 +44,21 @@
<main id="top" class="shell">
<section class="hero panel">
<p class="kicker">Split Labs • Dictx</p>
<h1>Voice capture for serious writing workflows.</h1>
<h1>Transcription you can trust in real work.</h1>
<p class="lede">
Transcribe locally, keep control of your data, and ship faster with a
desktop app designed for daily use.
</p>
<ul class="trust-points" aria-label="Core value points">
<li>No cloud lock-in</li>
<li>Runs on your machine</li>
<li>Signed Pro builds</li>
</ul>
<div class="actions">
<a class="btn primary" href="/buy">Buy Dictx Pro</a>
<a
class="btn soft"
href="https://github.com/0xNyk/dictx/releases"
href="https://github.com/splitlabs/dictx/releases"
target="_blank"
rel="noreferrer"
>Download releases</a
Expand All @@ -49,6 +68,9 @@ <h1>Voice capture for serious writing workflows.</h1>
$29 one-time • signed binaries • auto-updates • macOS / Windows /
Linux
</p>
<div class="hero-proof">
<p>Open source (GPL) • 17 locales • macOS / Windows / Linux</p>
</div>
</section>

<section id="features" class="grid3">
Expand Down Expand Up @@ -88,7 +110,7 @@ <h2>Free or Pro</h2>
</ul>
<a
class="btn ghost"
href="https://github.com/0xNyk/dictx"
href="https://github.com/splitlabs/dictx"
target="_blank"
rel="noreferrer"
>View source</a
Expand Down Expand Up @@ -128,6 +150,10 @@ <h2>FAQ</h2>
`landing/vercel.json`.
</p>
</details>
<div class="final-cta">
<p>Ready to skip manual builds and keep updates automatic?</p>
<a class="btn primary" href="/buy">Get Dictx Pro</a>
</div>
</section>
</main>

Expand Down
Binary file added landing/logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
62 changes: 61 additions & 1 deletion landing/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,9 +58,21 @@ body {
gap: 20px;
}

.brand {
display: inline-flex;
align-items: center;
gap: 10px;
text-decoration: none;
}

.brand-icon {
width: 30px;
height: 30px;
border-radius: 8px;
}

.wordmark {
color: var(--color-logo-primary);
text-decoration: none;
font-size: 34px;
font-weight: 700;
letter-spacing: -0.04em;
Expand Down Expand Up @@ -128,6 +140,24 @@ h1 {
font-size: clamp(18px, 2.2vw, 23px);
}

.trust-points {
display: flex;
flex-wrap: wrap;
gap: 9px;
list-style: none;
padding: 0;
margin: 20px 0 0;
}

.trust-points li {
border: 1px solid color-mix(in srgb, var(--color-mid-gray) 28%, transparent);
background: color-mix(in srgb, var(--color-logo-primary) 8%, transparent);
border-radius: 999px;
padding: 6px 10px;
font-size: 12px;
color: color-mix(in srgb, var(--color-text) 86%, transparent);
}

.actions {
display: flex;
flex-wrap: wrap;
Expand Down Expand Up @@ -186,6 +216,19 @@ h1 {
font-size: 13px;
}

.hero-proof {
margin-top: 16px;
border-top: 1px solid
color-mix(in srgb, var(--color-mid-gray) 20%, transparent);
padding-top: 10px;
}

.hero-proof p {
margin: 0;
font-size: 12px;
color: color-mix(in srgb, var(--color-text) 60%, transparent);
}

.grid3 {
margin-top: 16px;
display: grid;
Expand Down Expand Up @@ -304,6 +347,23 @@ details p {
color: color-mix(in srgb, var(--color-text) 72%, transparent);
}

.final-cta {
border-top: 1px solid
color-mix(in srgb, var(--color-mid-gray) 24%, transparent);
margin-top: 6px;
padding-top: 14px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
flex-wrap: wrap;
}

.final-cta p {
margin: 0;
color: color-mix(in srgb, var(--color-text) 82%, transparent);
}

.foot {
padding-bottom: 30px;
color: color-mix(in srgb, var(--color-text) 48%, transparent);
Expand Down