Brand Kit

Visual identity, design tokens, and usage guidelines for darshan.is-a.dev.

01

Identity

Name

Darshan

Domain

darshan.is-a.dev

Tagline

Full-Stack Developer

Location

Bengaluru, India

02

Color Palette

Light Mode

Background

#f4f2ec

Background Soft

#ece9e0

Foreground

#0b0b0b

Foreground Soft

#45413a

Foreground Muted

#8a8579

Border

#e0dbcd

Card

#fbfaf6

Accent

#6d4aff

Accent Soft

#efeaff

Dark Mode

Background

#0c0c0c

Background Soft

#131313

Foreground

#f4f2ec

Foreground Soft

#b9b4a7

Foreground Muted

#76716a

Border

#26261f

Card

#141414

Accent

#9b87ff

Accent Soft

#1c1733

Semantic Groups

Surfaces

bg / bg-soft / card

Text

fg
fg-soft
fg-mute

Accent

accent
soft
03

Typography

Inter Body / UI

The quick brown fox jumps over the lazy dog

font-family: inter

Instrument Serif Display Headings

The quick brown fox jumps over the lazy dog

font-family: instrument-serif

JetBrains Mono Code / Labels

const hello = 'world';

font-family: jetbrains-mono

Type Scale

7rem Display
3.5rem Heading
1.6rem Subheading
1.05rem Body text — used for paragraphs and descriptions across the site.
0.85rem Small — used for card details and secondary info.
0.6875rem Eyebrow / Label — mono, uppercase, tracked
04

Components

Buttons

Surfaces

Default Surface

Used for cards, content blocks, and containers.

Hover Surface

Lifts on hover with border and shadow transition.

Accent Border

Used for highlighted or active states.

Labels

Eyebrow Label Pill Badge Tag

Border Radius

0.75rem
1.25rem
999px
05

Spacing & Layout

Max Width

1280px

Page Padding

1.5rem (24px)

Card Padding

1.5rem (24px)

Section Gap

7rem (112px)

06

Motion

Easing

cubic-bezier(0.16, 1, 0.3, 1)

Used for all entrance and hover transitions.

Duration (Fast)

0.3s — 0.4s

Buttons, hovers, color transitions.

Duration (Slow)

0.5s — 0.6s

Page reveals, layout shifts, theme switch.