branding
Differences
This shows you the differences between two versions of the page.
| Next revision | Previous revision | ||
| branding [2023/02/22 08:31] – created m0ukf | branding [2025/01/21 09:50] (current) – typo corrections gm5aug | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ===== Colour Pallets | + | ====== |
| - | ==== OARC Blue ==== | + | |
| - | < | + | This page is designed to serve as a guide to our visual identity, including our logos, colour palette, and font information. The page is intended to help us represent ourselves consistently across all our communications |
| - | <style type=" | + | |
| - | /* Palette color codes */ | ||
| - | /* Feel free to copy& | ||
| - | .primary-1a { background-color: | + | ===== Colour Pallets ===== |
| - | .primary-2a { background-color: | + | |
| - | .primary-0a { background-color: | + | |
| - | .primary-3a { background-color: | + | |
| - | .primary-4a { background-color: | + | |
| - | /* end */ | + | ==== OARC Sapphire ==== |
| + | {{:: | ||
| + | HEX: #2185FC, #0878FF, #005FD1, #00479C, #00387A | ||
| + | ==== OARC Emerald ==== | ||
| + | {{:: | ||
| - | body { | + | HEX: #31B64E, |
| - | margin:0; padding: 2em; | + | ===== Font Faces ===== |
| - | background: #fff; | + | |
| - | color: | + | |
| - | font: 12px/1.33 "Segoe UI", " | + | |
| - | text-align: | + | |
| - | } | + | |
| - | h1 { | + | |
| - | margin: 0.5em 0; | + | |
| - | font-size: 200%; | + | |
| - | } | + | |
| - | p { | + | |
| - | margin: 0.5em 0; | + | |
| - | } | + | |
| - | .color-table { | + | Font Type: Sans-serif |
| - | margin: 2em 2em 5em; | + | |
| - | border-collapse: | + | |
| - | border: | + | |
| - | border-spacing: | + | |
| - | font-size: | + | |
| - | } | + | |
| - | .color-table th { | + | |
| - | padding: 0 1em 0 0; | + | |
| - | text-align: | + | |
| - | vertical-align: | + | |
| - | font-size: 100%; | + | |
| - | font-weight: | + | |
| - | border: none; | + | |
| - | } | + | |
| - | .color-table td.sample { | + | |
| - | width:6em; height: | + | |
| - | padding: 10px; | + | |
| - | text-align: | + | |
| - | vertical-align: | + | |
| - | font-size: | + | |
| - | border: 1px solid white; | + | |
| - | white-space: | + | |
| - | } | + | |
| - | .color-table td.sample-0 { | + | |
| - | width: | + | |
| - | } | + | |
| - | .color-table.small td.sample { | + | |
| - | width:3em; height: | + | |
| - | padding: | + | |
| - | border: | + | |
| - | } | + | |
| - | .color-table.small td.sample-0 { | + | |
| - | width: | + | |
| - | } | + | |
| - | .color-table .white { margin-bottom: | + | |
| - | .color-table .black { margin-top: | + | |
| - | hr { | ||
| - | margin: 2em 0 1em 0; | ||
| - | border: | ||
| - | border-bottom: | ||
| - | } | ||
| - | #footer { | ||
| - | padding: | ||
| - | text-align: | ||
| - | font-size: | ||
| - | } | ||
| - | |||
| - | </ | ||
| - | |||
| - | |||
| - | |||
| - | |||
| - | <table class=" | ||
| - | < | ||
| - | < | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | <table class=" | ||
| - | < | ||
| - | < | ||
| - | <td class=" | ||
| - | <td class=" | ||
| - | <td class=" | ||
| - | <td class=" | ||
| - | <td class=" | ||
| - | </ | ||
| - | </ | ||
| - | <style type=" | ||
| - | |||
| - | /* Palette color codes */ | ||
| - | /* Feel free to copy& | ||
| - | |||
| - | .primary-1 { background-color: | ||
| - | .primary-2 { background-color: | ||
| - | .primary-0 { background-color: | ||
| - | .primary-3 { background-color: | ||
| - | .primary-4 { background-color: | ||
| - | |||
| - | /* end */ | ||
| - | |||
| - | |||
| - | body { | ||
| - | margin:0; padding: 2em; | ||
| - | background: | ||
| - | color: #000; | ||
| - | font: 12px/1.33 "Segoe UI", " | ||
| - | text-align: | ||
| - | } | ||
| - | h1 { | ||
| - | margin: 0.5em 0; | ||
| - | font-size: 200%; | ||
| - | } | ||
| - | p { | ||
| - | margin: 0.5em 0; | ||
| - | } | ||
| - | |||
| - | .color-table { | ||
| - | margin: 2em 2em 5em; | ||
| - | border-collapse: | ||
| - | border: | ||
| - | border-spacing: | ||
| - | font-size: | ||
| - | } | ||
| - | .color-table th { | ||
| - | padding: 0 1em 0 0; | ||
| - | text-align: | ||
| - | vertical-align: | ||
| - | font-size: 100%; | ||
| - | font-weight: | ||
| - | border: none; | ||
| - | } | ||
| - | .color-table td.sample { | ||
| - | width:6em; height:6em; | ||
| - | padding: 10px; | ||
| - | text-align: | ||
| - | vertical-align: | ||
| - | font-size: | ||
| - | border: 1px solid white; | ||
| - | white-space: | ||
| - | } | ||
| - | .color-table td.sample-0 { | ||
| - | width: | ||
| - | } | ||
| - | .color-table.small td.sample { | ||
| - | width:3em; height:3em; | ||
| - | padding:0; | ||
| - | border: | ||
| - | } | ||
| - | .color-table.small td.sample-0 { | ||
| - | width:9em; | ||
| - | } | ||
| - | .color-table .white { margin-bottom: | ||
| - | .color-table .black { margin-top: | ||
| - | |||
| - | hr { | ||
| - | margin: 2em 0 1em 0; | ||
| - | border: | ||
| - | border-bottom: | ||
| - | } | ||
| - | #footer { | ||
| - | padding: | ||
| - | text-align: | ||
| - | font-size: | ||
| - | } | ||
| - | |||
| - | </ | ||
| - | |||
| - | </ | ||
| - | </ | ||
| - | ==== OARC Emerald ==== | ||
| - | < | ||
| - | <table class=" | ||
| - | < | ||
| - | < | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | <td class=" | ||
| - | <div class=" | ||
| - | <div class=" | ||
| - | </ | ||
| - | </ | ||
| - | </ | ||
| - | <table class=" | + | {{:branding-font.png? |
| - | < | + | |
| - | < | + | |
| - | <td class=" | + | |
| - | <td class=" | + | |
| - | <td class=" | + | |
| - | <td class=" | + | |
| - | <td class=" | + | |
| - | </ | + | |
| - | </ | + | |
| + | Guidance | ||
| + | * Headlines or Titles: 20-36 pt (depending on the size of the document) | ||
| + | * Subheadings: | ||
| + | * Body Text: 10-14 pt | ||
| + | * Captions or Labels: 8-10 pt | ||
| - | <p id=" | + | ===== Logos & Templates ===== |
| - | </ | + | Logos and Presentation Files |
| - | ===== Font Type ===== | + | https:// |
| - | Sans-serif | + | ===== To Do ===== |
| - | Sans-serif Bold | + | |
| + | * Upload Logos | ||
| + | * Create Letter Template | ||
| + | * Create PowerPoint Template | ||
| + | * Create Email Signature Template | ||
branding.1677054684.txt.gz · Last modified: by m0ukf
