Brand portal
OriginIT brand portal
Official logos, colours, typography, icons and templates. Everything here is the current, approved version. Link to it instead of keeping copies.
01 · Logo
Logos
Every logo comes as transparent SVG, standard and high-res PNG, vector PDF for print, and SVG with its background. Select any logo to preview it on light, dark or the horizon, copy a live link, resize it, or edit it online.
02 · Concept
What the logo means
- The dot · IdeaThe starting point of an idea. Innovation begins with people and their thoughts.
- The circular "O" · Global & technologyA globe: connectivity and continuous progress in technology.
- The orbit · ProgressMovement and growth: turning ideas into real solutions.
- Origin · BeginningThe source, where ideas and innovation start.
- IT · TechnologyOur core business: Information Technology.
03 · Colour
Colour palette
Charcoal and white carry the brand; orange is the energy. Use it for the idea, the orbit, the IT and one call to action, never as a background wash. Click any code to copy it.
Energy · Innovation · Creativity
Trust · Professionalism · Strength
Wordmark, headlines, body text
Balance · Modernity · Stability
Clean · Simplicity
Clarity
Gradient start, highlights
Gradient end, pressed states
Brand gradient
For the mark and the IT only.
Balance
Keep orange to about a tenth of any layout.
:root {
--oit-primary-orange: #FF7A00;
--oit-charcoal-black: #0B0B0B;
--oit-ink: #111111;
--oit-modern-gray: #6B6B6B;
--oit-light-gray: #F7F7F7;
--oit-white: #FFFFFF;
--oit-glow: #FFA23A;
--oit-ember: #E65C00;
--oit-gradient: linear-gradient(135deg, #FFA23A 0%, #FF7A00 50%, #E65C00 100%);
--oit-font: 'Poppins', 'Segoe UI', system-ui, sans-serif;
}
04 · Typography
Poppins
One geometric typeface for everything, matching the wordmark. Bold for headlines, Medium tracked wide for the tagline, Regular for text. It's free under the SIL Open Font License.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & @ # ? !
Font files
Use on the web
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
font-family: 'Poppins', 'Segoe UI', system-ui, sans-serif;05 · Icons
App icon & favicon
A squircle tile for app stores and home screens. A sturdier small version keeps the mark legible at 16 px.
Add to a website's <head>
<link rel="icon" href="https://brand.originitx.com/cdn/favicon.svg" type="image/svg+xml">
<link rel="icon" href="https://brand.originitx.com/cdn/favicon.ico" sizes="48x48">
<link rel="apple-touch-icon" href="https://brand.originitx.com/cdn/apple-touch-icon.png">
<meta name="theme-color" content="#0B0B0B">06 · Backgrounds
The horizon
Earth's night side, centred on Bangladesh. The city lights come from real population data, with Dhaka dead-centre just below the glowing rim. Each file is rendered at the platform's exact size, so nothing gets stretched.
07 · Templates
Templates & graphics
Stationery and social layouts. The editable versions, with live text and linked logos, are in the team Figma file.
08 · Guidelines
Using the logo well
A few rules keep the brand recognisable everywhere it appears.
Clear space
Keep a margin at least the diameter of the orange idea dot on every side. Nothing goes inside it.
Minimum size
120 px · 30 mmHorizontal logo
24 px · 6 mmMark
Below these sizes, switch to the mark or the favicon version.
Backgrounds
Full colour on white or light gray; the dark version on charcoal or dark imagery like the horizon.
Don't