Overview
Brand Foundation
The brand guide includes the brand foundation, application, and webpage sections, which serve to establish brand unity, broaden brand communication, and better convey brand concepts. The standard color of the brand is Sea Green, paired with Malachite as an accent color.
01
Basic Part of Visual Recognition
- Logo Design
- Brand Color
- Brand Font
02
Visual Recognition PPT Template
- Cover template
- Data template
- Template analysis
03
Visual Recognition Webpage Template
- Product poster
- Video cover
- Brand Story
04
Visual Recognition Application
- Business card
- Work badge
- Instruction Manual
Identity
Logo Design Symbolism
Most of the products under the brand are small household appliances, with product attributes of convenience and intelligence. Therefore, in logo design, the brand's first letter O is used for graphic processing, allowing the shape to have breathing space, while also having a sense of circulation and environmental protection. At the same time, using curves to connect letters gives a gentle and lightweight impression, providing users with a comfortable and relaxed user experience.
OAiRSIS
White on Evergreen
FG #FFFFFF · BG #022318
Primary application
OAiRSIS
White on Pine Tree
FG #FFFFFF · BG #058C42
Secondary application
OAiRSIS
Dark on Honeydew
FG #022318 · BG #D8F5D3
Light background use
Color System
Brand Standard Colors
Primary
Evergreen
#022318
RGB: 2, 35, 24
Primary brand color. Main backgrounds, dark surfaces, primary text on light.
Accent
Pine Tree
#058C42
RGB: 5, 140, 66
Accent color. Interactive elements, highlights, mid-tone backgrounds.
Light
Honeydew
#D8F5D3
RGB: 216, 245, 211
Light accent. Tinted backgrounds, subtle highlights, cards.
--color-evergreen: #022318;
--color-pine : #058C42;
--color-honeydew : #D8F5D3;
Typography
Brand Standard Fonts
AB
Poppins
Main title font — headings, UI, display, brand text
Light
Regular
Bold
Black
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
AB
Roboto
Main body font — body copy, data, captions, tables
Light
Regular
Bold
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
H1
Heading One
48px · Bold · Poppins
line-height: 1.1
H2
Heading Two
36px · Bold · Poppins
line-height: 1.2
H3
Heading Three
28px · SemiBold · Poppins
line-height: 1.25
H4
Heading Four
22px · SemiBold · Poppins
line-height: 1.3
H5
Heading Five
18px · SemiBold · Poppins
line-height: 1.4
Subtitle
Subtitle font size — used below headings
16px · Regular · Poppins
line-height: 1.5
Body
Body copy — main reading text, paragraphs, descriptions
14px · Regular · Roboto
line-height: 1.6
Caption
Caption text — labels, metadata, supplementary info
12px · Regular · Roboto
line-height: 1.5
Assets
Package File Structure
oairsis-design-system/
├── tokens/
│ ├── tokens.json // Design tokens — Figma Tokens / Style Dictionary import
│ └── variables.css // CSS custom properties for web projects
│
├── assets/
│ ├── logo/
│ │ ├── oairsis-logo-white-on-dark.svg // White on #022318
│ │ ├── oairsis-logo-white-on-pine.svg // White on #058C42
│ │ └── oairsis-logo-dark-on-light.svg // Dark on #D8F5D3
│ └── colors/
│ └── brand-palette.svg // Color swatch reference
│
└── docs/
└── design-system.html // This reference document
Quick Reference
Design Tokens Snippet
--color-evergreen: #022318;
--color-pine: #058C42;
--color-honeydew: #D8F5D3;
--font-primary: 'Poppins', sans-serif;
--font-secondary: 'Roboto', sans-serif;
--text-h1: 48px; --text-h2: 36px; --text-h3: 28px;
--text-h4: 22px; --text-h5: 18px; --text-body: 14px;
--space-xs: 4px; --space-sm: 8px; --space-md: 16px;
--space-lg: 24px; --space-xl: 40px; --space-2xl: 64px;