Appearance
Liatir Branding
Use these assets when referencing Liatir in articles, documentation, integrations, marketplace listings, launch pages, or community posts.
Primary color
#4f39f6Copied!
CSS Variables
css
--color-liatir: #4f39f6;
var(--color-liatir);css
--color-liatir-2: #6254f8;
var(--color-liatir-2);css
--color-liatir-3: #7a70f8;
var(--color-liatir-3);css
--color-liatir-soft: rgba(79, 57, 246, 0.12);
var(--color-liatir-soft);Logo assets
SVG icon
Use the SVG icon when you need a scalable mark, favicon, or compact brand symbol.
PNG logo
Use the PNG logo when you need the full Liatir logo in presentations, landing pages, product listings, or visual previews. Download it here.
| Size | Standard | Mono | Standard B | Standard W | Mono B | Mono W |
|---|---|---|---|---|---|---|
| X16 | ||||||
| X32 | ||||||
| X48 | ||||||
| X64 | ||||||
| X96 | ||||||
| X128 | ||||||
| X150 | ||||||
| X180 | ||||||
| X192 | ||||||
| X256 | ||||||
| X384 | ||||||
| X512 | ||||||
| X1024 |
Usage guidelines
When using the Liatir brand, please keep the logo readable, clear, and visually separated from surrounding elements.
Use enough spacingLeave clear space around the logo so it does not feel cramped.
Keep proportionsDo not stretch, squeeze, rotate, or distort the logo.
Use the official colorUse
#4f39f6 as the main accent color when referencing Liatir.Prefer contrastPlace the logo on backgrounds where it remains easy to read.
Short description
You can use this short description when linking to Liatir:
Liatir is a free desktop app that runs bioinformatics tools, AI models, custom plugins, and pipelines locally, keeping your data on your machine while delivering native performance, even with multi-gigabyte files.
Copied!Longer description
A more detailed version for product pages, forums, blog posts, directories, press kits, partner listings etc.
Liatir is a free, local-first desktop app for bioinformatics analysis. It brings together tools such as FastQC, Samtools, BCFtools, fastp, and more, advanced AI models, and visual pipelines to connect multiple steps into reusable workflows, in one simple interface. You can also extend the app virtually without limits with your own custom plugins. Your data never leaves your machine while delivering native-speed performance, even on multi-gigabyte files.
Copied!Embeddable badges
Get started withLiatir
html
<a class="liatir-badge liatir-badge-dark" href="https://liatir.com" target="_blank" rel="noopener noreferrer" style="display:inline-flex;align-items:center;gap:14px;padding:14px 18px;min-width:120px;border:1px solid rgba(255,255,255,0.06);border-radius:18px;background:#1f1f1f;color:#ffffff;text-decoration:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;background:transparent;overflow:hidden;">
<img src="https://liatir.com/static/logos/svg/logo-square-color-mono.svg" alt="Liatir" style="width:100%;height:100%;object-fit:contain;display:block;" />
</span>
<span style="display:flex;flex-direction:column;line-height:1.05;">
<span style="color:rgba(255,255,255,0.68);font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:0.02em;">Get started with</span>
<span style="margin-top:5px;color:#ffffff;font-size:18px;font-weight:800;letter-spacing:-0.03em;">Liatir</span>
</span>
</a>Get started withLiatir
html
<a class="liatir-badge liatir-badge-light" href="https://liatir.com" target="_blank" rel="noopener noreferrer" style="display:inline-flex;align-items:center;gap:14px;padding:14px 18px;min-width:120px;border:1px solid rgba(0,0,0,0.05);border-radius:18px;background:#ffffff;color:#111111;text-decoration:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;background:transparent;overflow:hidden;">
<img src="https://liatir.com/static/logos/svg/logo-square-color-mono.svg" alt="Liatir" style="width:100%;height:100%;object-fit:contain;display:block;" />
</span>
<span style="display:flex;flex-direction:column;line-height:1.05;">
<span style="color:rgba(0,0,0,0.52);font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:0.02em;">Get started with</span>
<span style="margin-top:5px;color:#111111;font-size:18px;font-weight:800;letter-spacing:-0.03em;">Liatir</span>
</span>
</a>