Airdev — Dark-blue Build Inquiry CTA
Call to action · Design and development agency
Landing page · Design and development agency
A light blue-and-white software-agency landing page combining a centered offer, eight product-screen thumbnails, two audience-specific service cards, a featured case study, product categories, client stories and a dark-blue closing CTA.
Download DESIGN.md into your project and ask your coding agent to follow it alongside this reference. Review inferred values against the original before implementation.
---
version: alpha
name: Airdev — Custom Software and MVP Agency Landing Page
colors:
canvas: '#FFFFFF'
text: '#0D2350'
observed-1: '#020817'
observed-2: '#1A1A1A'
observed-3: '#1265EF'
observed-4: '#4B5563'
typography:
heading:
fontFamily: Colfax, system-ui, -apple-system, sans-serif
fontSize: 80px
fontWeight: 700
lineHeight: 84px
body:
fontFamily: Colfax, system-ui, -apple-system, sans-serif
fontSize: 20px
fontWeight: 400
lineHeight: 32.5px
---
## Overview
A light blue-and-white software-agency landing page combining a centered offer, eight product-screen thumbnails, two audience-specific service cards, a featured case study, product categories, client stories and a dark-blue closing CTA. Inspected on 2026-10-01 at 1440px and 390px viewport widths. This is a complete page/screen capture, not an isolated element crop.
## Colors
The YAML palette records computed opaque CSS text/action colors. The canvas is the computed background where opaque; for transparent roots it is sampled from the native screenshot corner. Gradients are described visually rather than assigned invented stop values. Gradients, illustration hues and brand-logo colors should not be flattened into one universal accent. Preserve the visual contrast between the main reading surface, text and actions shown in the capture.
## Typography
The selected h1 sample uses Colfax, system-ui, -apple-system, sans-serif, 80px / 84px, weight 700; supporting text uses 20px / 32.5px. Its corresponding mobile sample is 56px / 58.8px. These are computed source samples, not a claim that all text uses the same style. Use properly licensed fonts or appropriate fallbacks when adapting.
## Layout
Desktop uses a wide two-row product mosaic and paired startup/business offers; mobile narrows the mosaic and stacks the offers. Case-study tabs and testimonial cards stay attached to their source context. Measured screenshot bounds: 1440 × 6738px desktop and 390 × 11510px mobile. Two observed widths do not establish the exact CSS breakpoint rules.
## Elevation & Depth
Light card borders and restrained shadows separate service and testimonial cards; product imagery remains the main visual evidence.
## Shapes
Rounded rectangular panels, simple blue actions, compact labels and large interface thumbnails.
## Components
A light blue-and-white software-agency landing page combining a centered offer, eight product-screen thumbnails, two audience-specific service cards, a featured case study, product categories, client stories and a dark-blue closing CTA. White and pale-blue surfaces, navy text, cobalt actions and darker blue gradient callouts. Captured logged out at two widths. Menu, booking, form submission, hover and alternate carousel states were not exercised.
## Do's and Don'ts
Separate the startup MVP offer from the internal-tools offer so visitors can identify their path without reading every service. Reuse layout principles, not client logos, testimonials, proprietary artwork or source performance claims. Provide keyboard focus, meaningful labels and reduced-motion alternatives in any implementation; those recommendations are not claims of source behavior tested here.
If copying fails, download the file or select the text above.
Design belongs to its original creator. Use this example for inspiration, not as a licensed template.