Design System

Vendora Brand Identity

A unified design language spanning four applications — Vendor Web, Client Web, Vendor Mobile, and Client Mobile. Two ecosystems, one cohesive brand.

Logo System

Primary Mark

Vendora

Horizontal Lockup

Ecosystem Icons (Vendor / Client)

Color Palette

Core Neutrals

Background

#06060c

Elevated

#0c0c18

Card

#111122

Foreground

#f0ece4

Muted

#7a7a90

Dim

#4a4a5e

Vendor Ecosystem — Amber

Primary

#e8a849

Hover

#f0b960

Dim

12% alpha

Gradient End

#d4943a

On-Primary

#1a0f00

Client Ecosystem — Teal

Primary

#2dd4a8

Hover

#4ae6bc

Dim

12% alpha

Gradient End

#1fb892

On-Primary

#001a12

System Semantics

Success

#34d399

Warning

#fbbf24

Error

#f87171

Info

#60a5fa

Typography Scale

H1 / 48px

Store Dashboard

H2 / 36px

Product Catalog

H3 / 24px

Order Details

H4 / 18px

Variant Configuration

Body / 15px

Manage your store products, track orders, and configure variants with SPU/SKU architecture.

Small / 13px

SKU: NAM90-RD-L · In Stock: 42 units

Caption / 11px

Pending Approval

Spacing Scale

4px

8px

12px

16px

24px

32px

48px

64px

Border Radius

sm / 6px

md / 10px

lg / 14px

xl / 20px

full / 9999px

Application 01

Vendor Web App

Dashboard, product management, order fulfillment, and store configuration. Built for efficiency and control.

App Shell Layout

Main content area — dashboard widgets, data tables, forms

Buttons — Vendor

PRIMARY

SECONDARY

GHOST & DANGER

Form Elements — Vendor

Product Name (SPU)

Order	Customer	Items	Total	Status
#VND-2847	Sarah Chen	3 SKUs	$247.00	Shipped
#VND-2846	Mark Johnson	1 SKU	$89.00	Processing
#VND-2845	Elena Rodriguez	2 SKUs	$156.00	Cancelled

Client Web App

Marketplace browsing, vendor storefronts, product discovery, cart, and order tracking. Built for delight and speed.

App Shell Layout

Marketplace content — vendor cards, product grids, category navigation

Buttons — Client

PRIMARY

SECONDARY

GHOST & NEUTRAL

Form Elements — Client

Shipping Address

Variant Selection

Color

Subscribe to order updates

Product Card — Client Storefront

Acme Goods

Nike Air Max 90

3 colors · 3 sizes

$119

Low Stock

TechHub

ProBook 15"

2 variants

$1,299

HomeStyle

Ergonomic Desk Chair

1 color · 2 configs

$449

AudioPro

Studio Max Headphones

4 colors

$279

Order Tracking Widget

Order

#VND-2847

Processing

PlacedConfirmedProcessingShippedDelivered

Estimated delivery: Jan 15, 2025

Application 03

Vendor Mobile App

On-the-go store management, quick order processing, and real-time sales tracking.

Dashboard

9:41

Good morning

Acme Goods

Today's Sales

$1,247

New Orders

14

Quick Actions

Product

Orders

Theme

Stats

Recent Orders

#VND-2847

Sarah Chen · 3 items

$247

Pending

#VND-2846

Mark J. · 1 item

$89

Shipped

Home Products Orders Profile

Order Detail

9:41

Order #VND-2847

Sarah Chen

sarah@email.com

Items

Nike Air Max 90

Red · Size L × 2

$238

Nike Air Max 90

Black · Size M × 1

$119

Update Status

Home Products Orders Profile

SKU Management

9:41

Nike Air Max 90

SPU Overview

Brand: Nike · Category: Men's Shoes, Running

9 SKUs generated from 2 variants

Variant: Color

Red Blue Black

Variant: Size

S M L

SKU: Red / Small

Price

$119.00

Stock

42 units

SKU Code

NAM90-RD-S

Weight

0.8 kg

Home Products Orders Profile

Application 04

Client Mobile App

Browse vendors, discover products, manage cart, track orders, and receive real-time push notifications.

Marketplace

9:41

Deliver to

New York, NY

Search vendors & products

All Electronics Fashion Home

Featured Vendors

Acme Goods

24 products · Free shipping