Skip to content
telugutribe
Log in

Brand guidelines

telugutribe

తెలుగు ట్రైబ్ (telugutribe): the home for local clubs, weekend gatherings, and on-ground crew. A club meeting, a full street, a plan coming together.

Find your tribe. Every weekend.

Who we are

One idea runs through everything: a city feels alive when people show up for each other.

  • Warm, not corporate

    We sound like the friend who always knows the plan, not like a ticketing company.

  • Local first

    Vijayawada first, the city we know best. Telugu is part of the product, not a translation layer.

  • Easy to trust

    Playful in the words, plain and exact about money, refunds and safety.

Colour

Two themes, one system. Black (dark) and warm paper (light) are the canvases, ember is the single voice, lime is a rare spark. Both follow the device setting unless the person picks one.

Dark theme

  • 18.7:1 · AAA
    Black
    #0C0C0C · rgb(12, 12, 12)

    Page background. Always the base.

  • 17.0:1 · AAA
    Surface
    #181818 · rgb(24, 24, 24)

    Cards, menus and inputs.

  • 6.7:1 · AA
    Ember
    #FF6A45 · rgb(255, 106, 69)

    Primary actions, links, the logo mark. One main ember button per screen area.

  • 8.1:1 · AAA
    Ember, hover
    #FF8766 · rgb(255, 135, 102)

    Hover and pressed states of ember.

  • 18.7:1 · AAA
    Ink
    #FAFAF6 · rgb(250, 250, 246)

    Headlines and body text.

  • 11.2:1 · AAA
    Ink 2
    #C4C4BE · rgb(196, 196, 190)

    Secondary text, descriptions.

  • 7.1:1 · AAA
    Ink 3
    #9C9C96 · rgb(156, 156, 150)

    Captions and hints only.

  • 16.2:1 · AAA
    Lime
    #CCFF00 · rgb(204, 255, 0)

    A highlight, one or two per screen: Free, ranks, native script. Always with dark text.

Category colours

Each kind of event has its own colour and icon so the feed scans at a glance. Gradients are for covers; the soft tint and bright text are for chips.

  • Food & Beverage#F59E0B → #F97316
  • Social & Community#EC4899 → #F43F5E
  • Learning#3B82F6 → #6366F1
  • Music & Performance#8B5CF6 → #D946EF
  • Fitness & Outdoors#10B981 → #84CC16
  • Tech & Startups#06B6D4 → #3B82F6
Approved text pairs (computed from the real values)
SampleUseRatioWCAG
Em plan?Body text on black18.7:1AAA
Em plan?Secondary text on black11.2:1AAA
Em plan?Captions on black7.1:1AAA
Em plan?Body text on a card17.0:1AAA
Em plan?Captions on a card6.4:1AA
Em plan?Button label on ember6.7:1AA
Em plan?Ember text and links on black6.9:1AA
Em plan?Text on lime16.2:1AAA

Light theme

Same roles, different values. Ember is deepened so it still reads as text and links on paper, and the button label flips to white. Lime, the category gradients and the logo mark keep their hues.

  • 17.4:1 · AAA
    Paper
    #F5F3EE · rgb(245, 243, 238)

    Page background in light.

  • 19.3:1 · AAA
    Surface
    #FFFFFF · rgb(255, 255, 255)

    Cards, menus and inputs.

  • 5.3:1 · AA
    Ember, light
    #D02806 · rgb(208, 40, 6)

    Primary actions, links and the mark on paper.

  • 17.4:1 · AAA
    Ink, light
    #0E0E0E · rgb(14, 14, 14)

    Headlines and body text on paper.

Approved text pairs, light theme
SampleUseRatioWCAG
Em plan?Body text on paper17.4:1AAA
Em plan?Secondary text on paper10.2:1AAA
Em plan?Captions on paper5.9:1AA
Em plan?Captions on a tinted panel5.3:1AA
Em plan?Body text on a card19.3:1AAA
Em plan?Captions on a card6.5:1AA
Em plan?Button label on ember5.3:1AA
Em plan?Ember text and links on paper4.7:1AA
Em plan?Ember text on its soft tint4.6:1AA
Em plan?Success text on its tint4.8:1AA
Em plan?Error text on its tint5.3:1AA
  • Do: Use ember for the one thing you want someone to do next.
  • Do: Pair colour with an icon or words, so meaning never depends on colour alone (errors, success, categories).
  • Don't: Don't use ember for large background fills, or put ember text on ember-tinted panels.
  • Don't: Don't use pure black (#000) or pure white page backgrounds, or new accent colours.

Typography

Two typefaces. Bricolage Grotesque has the personality; Inter does the reading. Telugu script uses Noto Sans Telugu.

Display · Bricolage Grotesque

Aa

Em plan, Vijayawada?

Headlines, prices, big numbers, the wordmark. Weights 700 and 800, tight tracking.

Text · Inter

Aa

Runs, jams, supper clubs and workshops by people from your own city.

Body, forms, labels, captions. Body text never below 16 px on inputs (it stops iOS zooming).

sandadi48 to 72 px · Hero only
Heading 136 px · Page titles
Heading 224 px · Sections
Heading 318 px · Cards
Body16 px · Reading text, 1.5 line height
Small14 px · Descriptions
Caption12 px · Hints, metadata

Prices, counts, dates and times use tabular figures so digits don't jiggle as they change.

Surfaces

Flat and solid, like a printed poster. Panels have a thin ink outline, and anything that lifts leaves a hard offset shadow, like a sticker peeling off paper. Nothing is translucent.

.card

Content panels. Solid surface, thin outline. Hover one to see the lift.

.glass-menu

Menus and popovers. Full ink outline with the offset shadow.

.invert-panel

A section on the opposite colour. One per page at most.

Controls

PrimaryPrimarySecondaryGhostFreeGunturFitness & Outdoors
  • Do: Capsules for anything tappable; 28 px or larger corners for panels. Targets are at least 44 px.
  • Do: Hover steps a card or button up and to the left and leaves a hard ink shadow. A press puts it back down.
  • Do: Use the ember block (.mark) for one word in a headline, and the lime sticker once or twice per screen.
  • Don't: Don't add blur, translucency, gradients on panels or soft glows: that was an earlier look and has been retired.
  • Don't: Don't give resting cards the offset shadow. It is for hover, menus and the phone tab bar only.

Voice: Tinglish

Telugu and English, the way friends actually text. Playful where nothing is at stake; plain where money, safety or a decision is. Always keep the English beside the Telugu so nobody is ever lost.

WhereWe sayIt means
Home heroEm plan, Vijayawada?What's the plan, Vijayawada?
SearchEm kavali? Events, venues, vibesWhat do you want?
SuccessYou're in, booking ayyindi!Your booking is done.
Sold outHousefullNo spots left.
Empty cityInka em ledu in VijayawadaNothing here yet.
Not foundIkkada em leduThere's nothing here.
OfflineNet leduNo internet.
ReviewsEla jarigindi? How was it?How did it go?

Be playful here

Heroes, search, empty and error states, success moments, sold out, reviews, marquees, share messages.

Stay plain here

Prices, payments, refunds, cancellations, legal pages, form errors, WhatsApp and push messages, anything a person must act on.

  • Do: Short sentences. Verbs first. "Join for free", "Reserve spot", "Cancel and refund".
  • Do: Have a native Telugu speaker review any new Telugu line before it ships.
  • Don't: Don't explain a joke, stack three slang words in a row, or use Telugu where the English alone would be clearer.
  • Don't: Don't use emoji as icons or in buttons. Use the icon set.

Glossary

em plan
what's the plan
em kavali
what do you want
inka em ledu
nothing yet
ikkada em ledu
nothing here
net ledu
no internet
ayyindi
it's done
raa
come (to a friend)
mana
our
ela jarigindi
how did it go
housefull
sold out

Do and don't

The short version, for anyone building a screen, a campaign or a post.

Do

  • Do: Lead with one clear action per screen, in ember.
  • Do: Show real photos or a generated category cover. Never an empty grey box.
  • Do: Keep text at 4.5:1 contrast or better, on cards too.
  • Do: Respect reduced motion. The marquee and entrance effects must stop.
  • Do: Write times in Indian time and prices in rupees with tabular figures.

Don't

  • Don't: Don't use the name "Tribe", or any other competitor's tagline.
  • Don't: Don't promise "guaranteed" refunds or payouts beyond what the policy pages say.
  • Don't: Don't use lime for body text, or more than two highlights on a screen.
  • Don't: Don't mix the Telugu joke into error messages that tell someone what to fix.
  • Don't: Don't theme one page differently: every colour comes from a token, so both themes stay in step. Check new screens in light and dark.

Source of truth in the codebase: src/lib/brand.ts (names), src/app/globals.css (tokens and glass), design-system/sandadi/MASTER.md (rules). This page is rendered from the same values.