Brand guidelines Tithi Vidya

Moon days, made simple

Tithi Vidya helps anyone find their moon birthday, simply, privately and accurately. Calm, warm, trustworthy and modern, with a sense of wonder about the moon.

Logo

A moon at the start of its waxing half, Shukla Paksha: a bright crescent grows on the right of a blue-to-purple disc. Use the files as they are.

Horizontal, colour
Horizontal, colourSVGPNG
Horizontal, one colour
Horizontal, one colourSVGPNG
Horizontal, white
Horizontal, whiteSVGPNG
Stacked, colour
Stacked, colourSVGPNG
Stacked, white
Stacked, whiteSVGPNG
Mark, colour
Mark, colourSVGPNG
Mark, one colour
Mark, one colourSVGPNG
Mark, white
Mark, whiteSVGPNG
App icon and avatar
App icon and avatarSVGPNG
Wordmark
WordmarkSVGPNG

Clear space

Keep at least half the mark's height clear on every side. Smallest sizes: the mark at 16 px, the horizontal lockup at 120 px wide (30 mm in print), the stacked lockup at 80 px.

The logo with its clear space shown
Do
  • Use the colour logo on light backgrounds.
  • Use the white logo on dark or gradient backgrounds.
  • Use the one-colour logo where the gradient can't print.
Don't
  • Change colours, stretch, rotate or add effects.
  • Change the moon's phase or put the crescent on the left.
  • Retype "Tithi Vidya" in another font.
  • Put the colour logo on photos or the brand gradient.

Colour

Light only. Ratios are contrast against the page colour; text needs 4.5:1.

16.7:1Aa

Ink#15113d · Headings, important text

9.9:1Aa

Ink soft#3d3870 · Body text

7.3:1Aa

Ink mute#524b84 · Captions, dates, hints

Aa

Paper#f8f7ff · Page background

Aa

Line#e3dffb · Dividers, card edges

3.3:1Aa

Field line#8a80cf · Text box borders

5.3:1Aa

Blue#2758ec · Gradient start

6.2:1Aa

Indigo#4a3bf0 · Links, focus, icons

6.1:1Aa

Violet#7030e6 · Gradient middle

4.5:1Aa

Orchid#a23bea · Gradient end, large accents

Aa

Lilac 100#e7e2ff · Soft backgrounds, chips

Aa

Periwinkle 200#c6d1ff · The sky

Aa

Sun#ffb25e · The sun in charts only

Brand gradient · buttons, the mark linear-gradient(105deg, #2758ec 0%, #5138ee 48%, #8f35e8 100%)
Deep gradient · footer and call-to-action panels, white text

Typography

Display · Fraunces, soft, 600

Two birthdays

Headings, the wordmark and big numbers. Sentence case. One italic accent word per heading, in the text gradient.

Body · Plus Jakarta Sans

Find my tithi

Body text at 400, labels and buttons at 600 to 700. At least 16 px, about 70 characters a line.

Icons

24 px grid, 2 px round stroke, no fill, in the colour of the text around them. Shown here in indigo.

arrow
search
rss
mail
calendar
clock
pin
lock
link
star
fork
heart
spark
bell
bell-off
share
translate
play
pause
stop

Voice

Like this

"Your tithi birthday falls on a different date each year. Here is the simple reason."

Plain English, short sentences, warm and honest about limits.

Not like this

"Unlock the cosmic secrets hidden in your stars."

No mystical language, hype or fortune-telling.

The full rules are in README.md. Questions: contact@tithividya.org