Skip to content
DesignMunkDesignMunk Submit a site

Cerenovus

cerenovus.ai
AI Software Tailwind Homepage Lora Manrope
Share Visit site
cerenovus.ai DESKTOP · 1440
Cerenovus

AI Breakdown

Design export

---
version: alpha
name: Cerenovus
description: "Cerenovus is an AI‑driven technology company that builds intelligent platforms to help businesses automate decision‑making, extract insights from complex data, "
colors:
  primary: "#17181c"
  secondary: "#6c4f8b"
  tertiary: "#a87925"
  neutral: "#f7f6f2"
  brand-titan-white: "#dcd5e1"
  brand-candied-blueberry: "#3b126b"
  surface: "{colors.neutral}"
  on-surface: "{colors.primary}"
typography:
  headline-lg:
    fontFamily: Lora Variable
    fontSize: 51px
    fontWeight: 500
    lineHeight: 1.2
    letterSpacing: -0.042em
  headline-md:
    fontFamily: Lora Variable
    fontSize: 39px
    fontWeight: 500
    lineHeight: 1.36
    letterSpacing: -0.047em
  headline-sm:
    fontFamily: Lora Variable
    fontSize: 30px
    fontWeight: 500
    lineHeight: 1.25
    letterSpacing: -0.043em
  headline-xs:
    fontFamily: Manrope Variable
    fontSize: 23px
    fontWeight: 500
    lineHeight: 1.22
  body-md:
    fontFamily: Manrope Variable
    fontSize: 17.3px
    fontWeight: 400
    lineHeight: 1.72
rounded:
  sm: 22px
  full: 9999px
spacing:
  xs: 10px
  sm: 20px
  md: 28px
  lg: 36px
  xl: 56px
components:
  button-primary:
    backgroundColor: "{colors.primary}"
    textColor: "#ffffff"
    rounded: "{rounded.full}"
    padding: 16px 19.2px
    height: 58px
  button-secondary:
    textColor: "#5b5650"
    rounded: "{rounded.full}"
    padding: 16px 19.2px
    height: 58px
  button-link:
    textColor: "{colors.primary}"
    rounded: 0px
  card:
    backgroundColor: "#ffffff"
    textColor: "{colors.primary}"
    rounded: "{rounded.sm}"
    padding: 47.25px
---

# Cerenovus: Serif Authority Over a Quiet Beige Field

## Overview

Cerenovus presents a calm, enterprise-grade interface: serious, typographic, and evidence-first. The tone is authoritative without aggression—few colors, wide breathing room, and copy that leads. Design favors long-form claims, cited proof, and direct paths to a demo. Use this style when the goal is credibility, auditability, and low-friction reading across executive audiences.

## Colors

- **primary (#17181c):** Deep graphite for headlines, core text, and primary button fills.
- **secondary (#6c4f8b):** Reserved plum accent for links, small flags, or subdued highlights.
- **tertiary (#a87925):** Burnished accent for metrics, tags, or subtle emphasis—use sparingly.
- **neutral (#f7f6f2):** Off-white surface for pages and large sections.
- **brand-titan-white (#dcd5e1):** Pale lavender for dividers, borders, and soft panel backgrounds.
- **brand-candied-blueberry (#3b126b):** Dense grape for rare, high-contrast accents or illustrations.
- **surface ({colors.neutral}):** Default background—same as neutral.
- **on-surface ({colors.primary}):** Default text color on neutral and white surfaces.

## Typography

- Headlines (lg/md/sm): Lora Variable, 500 weight with tight negative tracking. Sizes run 51px, 39px, and 30px for page H1–H3 equivalents. This Variable build is self-hosted; if unavailable, use Lora (Google) as the primary substitute. Spectral (Google) or Source Serif 4 (Google) are acceptable alternates when Lora is not possible.
- Headline-xs: Manrope Variable 23px/1.22 for section ledes and strong UI labels. Self-hosted; substitute Manrope (Google). Inter (Google) or Public Sans (Google) also work when a geometric-humanist sans is preferred.
- Body: Manrope Variable 17.3px/1.72 at 400 weight for paragraphs, lists, and navigation. Keep sentences long-form and readable; avoid excessive bolding. Use the serif only for display levels; all dense explanatory text stays in the sans for legibility.

## Layout

Spacing is stepped and intentional: 56px anchors large section paddings, 36px for sub-sections, 28px for card interiors and column gutters, 20px for button groups and compact stacks, 10px for micro-copy and badges. Build sections as generous single or two-column blocks with long lines and ample margins. Keep text widths comfortable for executive reading; avoid cramped multi-column layouts above the fold.

## Elevation & Depth

Depth is minimal and warm-toned. Cards use a white background with the medium shadow for lift on the neutral surface; smaller elements can adopt the subtle sm shadow. The inner shadow provides a gentle pressed state or top highlight when needed. Where shadows are omitted, rely on tonal contrast (#ffffff on #f7f6f2) and padding to separate layers.

## Shapes

Corners are soft and confident. Cards and panels use a 22px radius for a contemporary, device-agnostic feel. Primary and secondary buttons are fully pill-shaped (9999px) to stand out as actions. Text links remain square (0px) to read as inline, not componentized.

## Components

- Button — Primary: Pill, 58px tall with 16px x 19.2px padding, filled #17181c with white text. Use for main CTAs like "Book a demo."
- Button — Secondary: Pill, 58px tall with the same padding, text #5b5650 on a transparent or light surface; pair beside the primary.
- Button — Link: Inline text action, 0px radius; use for navigational or tertiary actions.
- Card: White surface, 22px radius, 47.25px internal padding. Pair with the md shadow for feature blocks.

Distinctive modules on this page:

### YC Badge
Small inline badge near the hero headline signaling backing. Treat as micro-component with 10px spacing around and body size text.

### Hero Statement Block
Large Lora headline at 51px/1.2 with tight negative tracking, followed by a Manrope paragraph at 17.3px/1.72. Place a primary pill CTA then a secondary action beside it with 20px gap.

### Proof Bar
A single-line row of short promises ("Every claim cited...") styled as micro-copy with 10px spacing and ample letter-spacing. Use on neutral background without borders.

### "What Cerenovus does" Two-Column
Left column carries a serif subhead and paragraph; right column lists two sub-sections ("Find the leaks", "See ahead") each with a Manrope heading and paragraph. Maintain 28px gutters.

### Who-We-Serve Tabs
Horizontal list numbered 01–06 with segment labels. Use Manrope at headline-xs scale, 20–28px gaps, and clear hover/focus affordances. Each item links to a full page.

### Four Guarantees Grid
A 2x2 grid of cards using 22px radius, 47.25px padding, and the md shadow. Each card carries a bolded line, a short explainer, and a "Read the mechanism" link.

### Directional Directory
Three linked tiles ("How it works", "Who we serve", "Solutions") presented as a simple list or soft panels. Keep spacing at 36px between items.

### Bottom CTA Strip
A simple block with a short Lora headline and one primary pill CTA. Surround with 56px vertical padding to end the page decisively.

## Do's and Don'ts

- Do set primary headlines in Lora at 500 weight with the provided sizes and tracking; keep supporting text in Manrope.
- Do use #17181c for core text on #f7f6f2 or white; reserve accent colors for links and small highlights.
- Do keep primary CTAs at 58px height with pill corners; place secondary actions to the right with a 20px gap.
- Don't introduce new brand colors or gradients; rely on the neutral surface and sparse accents.
- Don't square off cards or buttons—22px and 9999px radii signal component hierarchy.
- Don't apply heavy drop shadows; prefer the subtle measured shadows or none at all.

## Agent Prompt Guide

Quick color reference — Text: #17181c; Background: #f7f6f2; Border: #dcd5e1; Accent: #6c4f8b (alt accent #a87925).

1) Build the hero
- Page background #f7f6f2. Centered content column.
- H1: font-family "Lora", size 51px, weight 500, line-height 1.2, letter-spacing -0.042em, color #17181c.
- Paragraph: font-family "Manrope", size 17.3px, line-height 1.72, color #17181c at 80% opacity if you support it.
- Buttons: primary pill 58px tall, padding 16px 19.2px, background #17181c, text #ffffff; secondary pill 58px, text #5b5650; 20px gap.

2) Four-card guarantees grid
- Section padding top/bottom 56px.
- Grid: 2 columns, gap 36px.
- Each card: background #ffffff, text #17181c, radius 22px, padding 47.25px, shadow rgba(78,58,14,0.4) 0px 24px 60px -30px.
- Heading in each card: "Lora" 30px/1.25 500; body: "Manrope" 17.3px/1.72.

3) Who-we-serve tabs
- Horizontal list with 28px gaps; border-bottom 1px solid #dcd5e1.
- Labels: "Manrope" 23px/1.22 500, color #17181c. On hover/focus, change text color to #6c4f8b.
- Each tab links to a details page; keep padding 20px vertically.

4) Bottom CTA strip
- Container background #f7f6f2; padding 56px.
- Headline: "Lora" 39px/1.36 500, color #17181c.
- Button: primary pill as above; place centered with 20px top margin.

5) Card list directory
- List of three items; each is a card with 22px radius, 28px padding, white background, optional shadow sm rgba(70,52,12,0.05) 0px 1px 2px 0px.
- Title: "Manrope" 23px/1.22 500; description: "Manrope" 17.3px/1.72; link styled as button-link with color #17181c.

## Similar Brands

- Palantir: similarly serious enterprise positioning with sparse color and typographic authority; Palantir skews denser and darker.
- Scale AI: calm neutrals and restrained CTAs; Scale leans more toward imagery and product shots than long-form claims.
- Hex: analytical storytelling with proof-oriented modules; Hex uses brighter accents and more UI screenshots.
- Retool: enterprise tooling with strong typography; Retool runs heavier sans display and higher visual contrast.
- Snowflake: conservative layout and credibility cues; Snowflake employs cooler blues and more illustration-driven sections.

More like this

Browse AI →
mintlify.com
Mintlify AI
Mintlify
Self-updating knowledge infrastructure for agents—24/7.
Homepage · 9 minutes ago
pallyy.com
Pallyy Marketing
Pallyy
Plan, approve, schedule, and publish on one simple social calendar.
Homepage · 2 hours ago
pallyy.com
Pallyy Pricing Marketing
Pallyy Pricing
A tidy three-column layout makes comparison easy, with the “Agency” tier clearly emphasized through a blue card, primary button, and “Recommended” badge.…
Pricing · 2 hours ago
kagaz.app
Kagaz Developer Tools
Kagaz
Invoice generator and API that creates beautiful invoices fast.
Homepage · 13 hours ago