Skip to main content
jCode Studio logo

Brand Identity Guide

jCode Studio LLC™

The visual language, voice, and values behind the studio — a living reference for how jCode Studio looks, sounds, and shows up.

01 — Tagline

Brand Tagline

Three directions — each with a distinct personality. The recommended option is deployed across the site. The others are available for specific contexts.

Recommended

Built to feel. Designed to last.

Covers both halves of the studio — development and design — in one crisp contrast. “Feel” carries double meaning: emotional resonance and tactile quality. “Last” speaks to longevity and craft over shortcuts.

Best for

Hero headlines, business cards, pitch decks

Playful

Where creativity compiles.

A developer’s pun that rewards the right audience. “Compiles” is a coding term that doubles as “comes together.” Fun, clever, and memorable — especially with a technical or startup crowd.

Best for

Social bios, conference badges, casual contexts

Client-first

Your vision, precisely built.

Centers the client and positions jCode Studio as a precise, reliable execution partner. “Precisely” signals craft without arrogance. Works well in service-oriented or proposal contexts.

Best for

Proposals, service pages, client-facing decks

02 — Color

Color System

A purple-forward palette rooted in warmth and creativity. Brand purple anchors every surface; the warm and cool accent families add depth and emotion.

Brand

Brand

#5e4875

Primary — buttons, links, key UI

Brand Vivid

#7B4FA0

CTAs, hover states, accents

Brand Light

#faf7ff

Page backgrounds, hero sections

Warm Accents

Pink

#eedbe6

Soft highlights, decorative blobs

Rose

#f5d5e0

Card backgrounds, warm sections

Blush

#fce4ec

Hover backgrounds, testimonials

Peach

#ffe5d9

Warm section washes

Cool Accents

Lavender

#e8e0f0

Section backgrounds, card fills

Lilac

#d6d6e9

Dividers, borders, neutral fills

Periwinkle

#c5cae9

Illustrations, skill chips

Sky

#d6eaf8

Info callouts, cool washes

Neutrals

Ink

#2d2438

Body text, dark UI

Cream

#F5F3EE

Warm off-white backgrounds

Grey

#f1f2f2

Subtle section dividers

White

#ffffff

Card surfaces, clean bg

03 — Typography

Type System

Display & Headings

Prata

Refined, high-contrast, and editorial. Prata is the same typeface used in the jCode Studio logo, used at Regular weight for headlines and display moments. It gives the studio its signature — considered, a little bit literary, unmistakably its own.

Regular 400 onlyHeadlinesDisplayLogo match

Body & UI

Be Vietnam Pro

Clean, modern, and highly legible at every weight. Be Vietnam Pro handles everything Prata doesn't — paragraphs, labels, navigation, tags, and UI text. Used across weights 400–700 to create hierarchy within running text.

400 Regular500 Medium600 SemiBold700 Bold
Display

Creative Vision

Prata Regular — hero moments only

H1

Web Projects

Prata Regular — page titles

H2

What I can build

Prata Regular — section headings

H3

Frontend Development

Prata Regular — card headings

H4

Project Overview

Be Vietnam Pro Bold — sub-headings

Body LG

Accessible, responsive digital experiences crafted with care.

Be Vietnam Pro 400 — intro text

Body

Clean, maintainable code built for the long haul — not just the demo.

Be Vietnam Pro 400 — paragraphs

Body SM

Updated March 2026 — Last reviewed by Joan Karstrom

Be Vietnam Pro 400 — secondary text

Caption

React · Next.js · Tailwind CSS · Figma

Be Vietnam Pro 500 — tags, chips

Label

Featured Project

Be Vietnam Pro 700 — eyebrow labels

04 — Values

The Four C's

Every decision at jCode Studio runs through these four principles. They're not aspirational — they're operational.

C

Craft

Everything at jCode Studio is made with deliberate attention. No templates, no shortcuts. Every pixel, every line of code, every word is considered.

C

Clarity

Complexity is inevitable. Confusion is not. The studio's job is to translate messy problems into clean, intuitive experiences — on screen and off.

C

Character

jCode Studio work has a personality. Warm, a little playful, deeply professional. Never generic. Never forgettable.

C

Connection

Technology is always in service of people. Every project is ultimately about creating a moment of genuine connection between a user and an idea.

05 — Voice

Voice & Tone

jCode Studio writes like a skilled creative talking to a smart human — never a robot talking to a search engine.

Warmnot cold
Directnot blunt
Confidentnot arrogant
Playfulnot silly
Humannot corporate

Hero headline

Built to feel. Designed to last.

Welcome to jCode Studio — Your Full-Service Web Development Agency

CTA button

Let's Connect

Submit Inquiry

Error state

Something went sideways — let's fix it.

Error 500: Internal Server Error

Project description

A gamified platform that reached 15k students in its first week.

A web application built using React and Next.js for Crime Stoppers of Houston.

Living Document

This guide grows with the studio.

As jCode Studio LLC™ evolves, so will this document. Colors get refined, voice gets sharper, and new components get documented here.