An official website of the United States Government 
Here's how you know

Official websites use .gov

A .gov website belongs to an official government organization in the United States.

Secure .gov websites use HTTPS

A lock ( lock ) or https:// means you’ve safely connected to the .gov website. Share sensitive information only on official, secure websites.

U.S. Department of War Brand Guide

Updated: Sept. 25, 2025

Overview Overview

The Department of War Brand Guide was developed to ensure a shared visual experience that reinforces DOW's identity and core priorities.

The foundation of the department's brand is the DOW Mission Statement:

The Department of War provides the military forces needed to deter war and ensure our nation's security.

Objective

The purpose of this guide is to ensure that no matter how people engage with DOW — on the website, via email or U.S. mail, through social media, livestream broadcasts or photographs — they are left with an impression that accurately reflects the department's brand identity and mission.

The department shares its story daily through official statements and a variety of informational products, engaging with many audiences around the world. Communicators should refer to this guide for correct use of the DOW brand in all communications, from inception to production and delivery, in all media.

Symbols of the DOW Brand

Please click here for important information and guidelines about the use of Department of War seals, logos, insignia and service medals.

The DOW Seal

DOW Seal

Congress established the War Department at the cabinet level, Aug. 7, 1789. In 1947, the Navy and War departments and the newly independent Air Force merged to become the National Military Establishment. Two years later, in 1949, the name was changed to Department of Defense and then-Defense Secretary Louis Johnson authorized the first design and use of a seal for the department. The seal was updated in September 2025 to reflect the use of a secondary title, Department of War, as directed in Executive Order 14347.

The design of the original seal and its symbolism is described in Appendix VI Joint Army and Air Force Bulletin No. 23:

"An American eagle is displayed facing to the right. Wings are horizontal. The eagle grasps three crossed arrows and bears on its breast a shield whose lower two-thirds carries alternating white and red stripes and whose upper third is blue. Above the eagle is an arc of thirteen stars with alternating rays. Below the eagle is a wreath of laurel extending to the eagle's right and wreath of olive extending to the eagle's left. On an encircling band is the inscription 'Department of Defense' and 'United States of America.'

The American bald eagle, long associated with symbolism representing the United States of America and its military establishment, has been selected as an emblem of strength. In facing to the right, the field of honor is indicated. The eagle is defending the United States, represented by the Shield of thirteen pieces. The thirteen pieces are joined together by the blue chief, representing the Congress. The rays and stars above the eagle signify glory, while the three arrows are collectively symbolic of the three component parts of the Department of War. The laurel stands for honors received in combat defending the peace represented by the olive branch.

When the seal is displayed in color, the background is to be of medium blue with the eagle and wreath in natural colors and the arrows, stars, and rays of gold. The encircling band is to be dark blue with gold edges and letters in white.

Elements of the DOW Brand

Design

The key components of DOW's visual brand identity — logos, typography and colors — should be used consistently across all platforms and media to reinforce and protect the brand.

Three items are critical to proper DOW visual branding:

  1. The DOW/Pentagon logo, which is the official, approved combination of the Pentagon icon and logotype.
  2. Typography, which consists of an approved family of typefaces for both digital and print content.
  3. Color palette, which consists of the approved palette and usage of specific colors.

Voice

Voice is the character of the brand and does not change. The DOW voice is straightforward, informational and authoritative.

To best convey the DOW voice, communicators should speak and write in a clear, accurate, concise and authoritative, though not necessarily formal, manner.

Tone

The tone of the DOW voice should be driven by audience, context and platform. A report posted on the War.gov website would necessarily include data and charts and more formal language, while feature content on the website may be written in a more conversational style and include videos and photos.

Name

Consistent use of the proper name of an entity and its representative acronym strengthens and reinforces brand identity.

Using DOW Voice and Tone

Applying the DOW voice and tone consistently in all communications is an essential part of reinforcing the brand:

  • Use Active Voice - avoid passive voice.
  • Write/Speak Clearly – use complete concise sentences; refer to the Official DOW Plain Language Website at https://www.esd.whs.mil/DD/plainlanguage/ as needed.
  • Use Plain English - avoid slang, jargon or acronyms.
  • Write With Authority – we are the experts in military and national security matters.

Associated Press Style: For consistency in word usage throughout copy, products and department communications, DOW communicators should refer to the Associated Press Stylebook, the reader-friendly industry standard in journalism and public affairs writing. (See https://www.apstylebook.com/.) Be sure to cross-check word usage with separate, relevant DOW style guides for exceptions to AP Stylebook rules.

Use of Name

In Executive Order 14347, issued Sept. 5, 2025, President Donald J. Trump directed the U.S. Department of Defense “be known as the Department of War,” a secondary title for this cabinet-level department. The order permits the use of this secondary title for official correspondence, public communications and ceremonial contexts within the executive branch.

Use "War Department" in most cases on first reference, reserving "Department of War" for quoted matter, or situations that require that level of formality.

The correct acronym for "War Department" as used on the War.gov flagship website, which uses the AP Style as standard, is "DOW" with an uppercase "O" in the center; use on second reference after "War Department" or when the standalone acronym suffices depending upon use. Do NOT use "DoW."

The correct acronym for "War Department" in official written department communications, including but not limited to news releases, speeches, transcripts etc., including those published on War.gov, is "DoW" with a lowercase "o", Do NOT use "DOW" in these types of products.

Use of DOW Brand Symbols

The DOW logo and seal are protected by law from unauthorized use. The 1946 Lanham Act, sometimes called the Trademark Act, and other trademark and licensing acts gives DOW, its components and the military services authorization to protect and license their names, insignia, seals, symbols, etc. Consequently, when the DOW logo and seal are used without authorization, the department may take appropriate action upon notification.

The DOW Logo

The logo may be used, in keeping with brand standards, in all DOW communications across all media platforms.

The DOW Seal

The DOW seal's use is restricted to official DOW top leader correspondence, legal documents, reports, memoranda, ceremonial booklets, certificates and awards.

Voice & Tone Elements of the DOW Brand

The DOW brand has one voice, with many tones that represent that voice. Voice is the character of the brand — the core tenet — and does not change. Tone is the expression of the DOW voice and can and should change based on the circumstance at hand.

Voice

The DOW voice is straightforward, informational, authoritative, a little edgy at times and sophisticated. We produce and present information that is accurate, well-written and timely. Our products tell stories and convey messages that are exciting, interesting, diverse and unique to DOW.

To best convey the DOW voice, DOW communicators need to speak and write plainly. We want to educate and inform people without confusing them or causing them to lose interest.

As you apply the DOW voice, keep in mind:

  • "Government speak" and "war speak" can be technical, cumbersome, awkward and hard to digest.
  • Unnecessary use of jargon and acronyms can cloud the DOW voice and message.
  • While the DOW voice is cutting-edge and contemporary, it should never come across as silly or overbearing in tone.
  • The DOW voice steers clear of politics and editorialization.

Tone

The tone of the DOW voice element of the brand used in a product should be driven by audience, context and platform.

For example, a publication posted to War.gov would, necessarily, include a lot of data and charts, slightly more formal language and technical information.

At the same time, a story posted to War.gov might highlight the innovation and adaptability that troops are employing to combat evolving threats such as enemy drone tactics and techniques. The feature story likely would be told with compelling video, engaging photos and enlightening storytelling that captures the urgency of ever-changing warfare and how the U.S. military is maintaining dominance on new battlefields.

Both products would use DOW's authoritative voice but carry different tones.

DOW's Key Audiences

Fewer than 1% of Americans serve in the U.S. military, yet the impact of their combined efforts is felt across the country and around the world. Therefore, reinforcing the DOW brand means we also must keep in mind that the audiences for our products are both broad and diverse.

At the international level, DOW participates in the global defense and security conversation through its various communications products.

On a national level, DOW works to educate and inform the public about policies and decisions and about service members' contributions, bridging the gap between those who serve and those we ask to support our armed forces.

Writing with the DOW Voice and Tone

The way we write says a lot about the DOW brand and the values it represents. DOW communicators must write concisely and with purpose so that our audiences can obtain information easily and quickly.

Sentences should be clear and complete. Avoid using slang, jargon and acronyms, except in cases where such terms may be relevant for the content given the audience.

Style Tips:

  • Use Active Voice — avoid passive voice; keep the writing lively and engaging
  • Use Plain English — avoid slang, jargon or acronyms whenever possible
  • Write With Authority — we are the experts in military and national security matters

AP STYLE: For consistency in word usage throughout copy, products and department communications, DOW communicators should refer to the AP Stylebook, the reader-friendly industry standard in journalism and public affairs writing. (See www.apstylebook.com.) Be sure to cross-check word usage with separate, relevant DOW style guides for exceptions to AP Stylebook rules.

DOW Seal DOW Seal

 

Official Seal

DOW Seal

This is the official seal for the DOW.

Description An American bald eagle with wings displayed horizontally grasping three crossed arrows and bearing on its breast a shield of 13 pieces Argent and Gules, a chief Azure. Above the eagle an arc of 13 stars with alternating rays. Below the eagle a wreath of laurel to dexter and olive to sinister. On an encircling band the inscription "DEPARTMENT OF WAR" at the top and "UNITED STATES OF AMERICA" at the bottom. When illustrating the seal in color, the background will be medium blue; the eagle and wreath proper; the arrows, stars and rays yellow/gold. The encircling band will be dark blue with yellow/gold edges and letters in white.

Symbolism The American bald eagle, long associated with symbolism representing the United States of America and its military establishment, has been selected as an emblem of strength. The eagle is defending the United States, represented by the shield of 13 pieces. The 13 pieces are joined together by the blue chief, representing the Congress. The rays and stars above the eagle signify glory, while the three arrows are collectively symbolic of the three component parts of the Department of War. The laurel stands for honors received in combat defending the peace represented by the olive branch.

Background The seal was originally approved on 8 October 1947 by the President for the National Military Establishment. The designation was changed to Department of Defense on 15 August 1949. It was changed back to Department of War in 2025.

The Department of War Seal is protected by law from unauthorized use, and may NOT be used for non-official purposes. There is no substitute for the Department of War Seal that may be used by non-DOW personnel that would represent the Department of War.

For more information, please refer to the DOW Branding & Trademarks page.

Sizing

The DOW seal has a minimum size standard that must be adhered to in all usage cases; the seal may be used at a larger scale as needed.

Minimum Sizing
DOW Seal

The DOW seal should not be rendered smaller than:

  • Web: 50px wide
  • Print: Approx. .5" wide
  • Broadcast: 50px wide

Seal Color

The following is the color guideline for the DOW seal.

Seal Element Color Yarn Cloth *PMS **HEX
DESIGNATION BAND OLD GLORY BLUE 67178 80075 280 #002169
BORDERS GOLDEN YELLOW 67104 65001 116 #FFCD00
HIGHLIGHTS LEMON YELLOW 67144 80090 114 #FCDC3E
SHADING GOLD 67106 80110 872 #B16D03
LETTERS WHITE 67101 65005 - #FFFFFF
SHADING SILVER GRAY 67137 65008 422 #9EA2A2
BACKGROUND BLUEBIRD 67117 65026 542 #7BADD3
EAGLE
HEAD, NECK, TAIL FEATHERS WHITE 67101 65005 - #FFFFFF
SHADING SILVER GRAY 67137 65008 422 #A0A0A0
DETAILS STEEL 67199 80141 430 #858585
WINGS, BODY, UPPER LEGS BROWN 67136 65016 161 #623C21
HIGHLIGHTS BURNISHED STRAW N/A 80165 1395 #825028
OUTLINES & DETAILS SPICEBROWN 67196 80129 168 #502C1E
LOWER LEGS, FEET, EYE, BEAK GOLDEN YELLOW 67104 65001 116 #FFCD00
HIGHLIGHTS LEMON YELLOW 67144 80090 114 #FFCD00
SHADING GOLD 67106 80110 872 #B5853C
PUPIL & TALONS BLACK 67138 65018 K #000000
HIGHLIGHTS SILVER GRAY 67137 65008 422 #A0A0A0
SHIELD
1ST ALTERNATING STRIPES WHITE 67101 65005 - #FFFFFF
2ND ALTERNATING STRIPES SCARLET 67111 65006 200 #C10230
CHIEF OLD GLORY BLUE 67178 80075 280 #002169
RIM GOLDEN YELLOW 67104 65001 116 #FFCD00
ARROWS, STARS, RAYS GOLDEN YELLOW 67104 65001 116 #FFCD00
HIGHLIGHTS LEMON YELLOW 67144 80090 114 #FCDC3E
SHADING GOLD 67106 80110 872 #B5853C
OLIVE BRANCH OLIVE 67134 80144 574 #4D5A31
HIGHLIGHTS MOSSTONE GREEN 67127 65022 377 #647D1A
BERRIES (DEXTER) SPICEBROWN 67196 80129 168 #75391C
SHADING BROWN 67136 65016 161 #993F1F
BERRIES (SINISTER) OLIVE 67134 80144 574 #4D5A31
SHADING ARMY GREEN 67131 66034 553 #324328
RIBBON TIE EGGSHELL 67141 80004 468 #DDC9A3

*Pantone matching system or equivalent. **HEX color code or equivalent. For location of color only and not for color match. Variation may occur in color of details between plaque printing and printed materials due to modeling effects.

Clear Space

Clear space is the open space around the seal and gives the seal ample breathing room from other text, images or graphics. The more clear space given to the seal the stronger impact it will have.

Official Seal
DOW Seal Spacing

Clear space around the official seal is equal to the thickness of the outer blue ring.

When using the seal in applications where the width is less than 150px, the allocated white space must double.

The rules outlined above must be followed in all circumstances unless given explicit written permission to do otherwise.

Avoid

The official DOW seal should in no way be edited or presented in any way except how it is displayed above. The size of the seal is the only variable that can be changed, while adhering to the minimum sizing requirements outlined above.

Downloads

Department of War Seal
DOW Seal
Black & White Seal
DOW Black and White Seal
Blue Seal
DOW Blue Seal

Typography Typography

Consistent typography can be a recognizable and synergistic part of any brand identity. All DOW-branded communications should use only the font families depicted in this section. The font families are separated into digital and print content.

A clear typographic system is critical to upholding the strength of the DOW brand. Type treatments should reflect the DOW as a strong and reliable voice. The DOW recommends a font system that uses three open-source font families: Oswald, Lato & Crimson Pro, all of which are designed for legibility and can adapted to a variety of styles.

Primary Typefaces

Lato Title

Lato is an open-source sans serif typeface created for legibility in UI design. The semi-rounded details of the letters give Lato a feeling of warmth, while the strong structure provides stability and seriousness.

Lato Specimen
Oswald Title

Oswald is a reworking of the classic style historically represented by the 'Alternate Gothic' sans serif typefaces. The characters of Oswald were initially re-drawn and reformed to better fit the pixel grid of standard digital screens.

Oswald Specimen
Crimson Pro Title

Crimson Pro is a typeface designed in the tradition of beautiful oldstyle typefaces. As a transitional serif design, Crimson Pro shows a number of traditional features of 'rational' serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals and a vertical axis.

The combination of light, regular, and bold weights gives the font family stylistic range, while conveying a desirable mix of classic, yet modern simplicity. Crimson Pro communicates warmth and credibility at both large and smaller font sizes.

Crimson Pro Specimen

Alternate Typefaces

These typefaces are to be used ONLY IF their primary counterparts are unavailable.

Arial Title

A contemporary sans serif design, Arial contains more humanist characteristics than many of its predecessors and as such is more in tune with the mood of the last decades of the twentieth century.

If Lato is unavailable, Arial (which is one of the most common system fonts available) may be used in its place.

Arial Specimen
Franklin Gothic Medium Condensed Title

Franklin Gothic Medium Condensed shares many of the aesthetic traits of Oswald, but can be found in most modern text editors.

If Oswald is unavailable, Franklin Gothic Medium Condensed (which is available in most modern environments) may be used in its place.

Franklin Gothic Medium Condensed Specimen
Times New Roman Title

Times New Roman has a robust weight/density on the page and influences of European early modern and Baroque printing. The design is slightly condensed, with short ascenders and descenders and a high x-height (tall lower-case letters), all effects that save space and increase clarity.

If Crimson Pro is unavailable, Times New Roman (which is one of the most common system fonts available) may be used in its place.

Times New Roman Specimen

Type Hierarchy

Consistent typography allows audiences to recognize content from the DOW.

Please see acceptable use cases below:

Primary

  • Web: Landing pages
  • Print: Posters, other promotional materials
  • Broadcast: Video slates, all other broadcast graphics.

This is an Example of a Standard Headline

This is an Example of a Subheadline

This is an example of body copy. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi iaculis sed ipsum quis sagittis. Nullam eget placerat purus. Vivamus facilisis felis ac eros congue rutrum. Integer non leo placerat, placerat ex at, condimentum purus. Sed ut massa non nunc rhoncus pretium ut non arcu. Ut in vulputate nulla, ut luctus magna.

Alternate

  • Web: Website article content (news/feature stories, blogs, press products, etc.)
  • Print: Official DOW documents
  • Broadcast: Not for use in broadcast

This is an Example of a Standard Headline

This is an Example of a Subheadline

This is an example of body copy. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi iaculis sed ipsum quis sagittis. Nullam eget placerat purus. Vivamus facilisis felis ac eros congue rutrum. Integer non leo placerat, placerat ex at, condimentum purus. Sed ut massa non nunc rhoncus pretium ut non arcu. Ut in vulputate nulla, ut luctus magna.

Type Color

  • Our primary font color across titles and body text is #333333 DOW Gray. This should be used against white and gray backgrounds.
  • Our secondary font color is #355e93 DOW Blue. This should be used sparingly and should only be used for stylized headings.
  • Our tertiary font color is #ffffff White and should only be used when placing text on dark backgrounds.
DOW Gray HEX: #333333 RGB: (51,51,51) CMYK: (0,0,0,80)
DOW Blue HEX: #355E93 RGB: (53,94,147) CMYK: (64,36,0,42)
White HEX: #ffffff RGB: (255,255,255) CMYK: (0,0,0,0)

Avoid

The examples shown here, while not all-inclusive, are presented to show improper uses of type.

Avoid setting all body copy in bold

Avoid setting all body copy in bold

Avoid using headings without sufficient contrast with body copy

Avoid using headings without sufficient contrast with body copy

Avoid setting both headline and body copy in Crimson Pro

Avoid setting both headline and body copy in Crimson Pro

Avoid applying extra letter spacing (tracking)

Avoid applying extra letter spacing (tracking)

Avoid applying more than the recommended amount of leading

Avoid applying more than the recommended amount of leading

Avoid setting body copy in all caps

Avoid setting body copy in all caps

Type Table

The following is a resource to help identify which typeface should be used in a specific context.

Page Title/Headline

Primary

Oswald Title

Alternate

Franklin Gothic Medium Condensed Title

Section Title/Headline

Primary

Lato Title

Alternate

Arial Specimen

Content Title/Headline

Primary

Crimson Pro Title

Alternate

Times New Roman Title

Body Copy

Primary

Lato Title

Alternate

Arial Title

*Only use the alternate option outlined above when primary is unavailable.

Color Color

Primary Color Palette

The primary color palette should be used for all main design elements.

Primary Blue HEX: #355e93 RGB: (53,94,147) CMYK: (64,36,0,42)PMS: 653 C
Gray HEX: #333333 RGB: (51,51,51) CMYK: (0,0,0,80) PMS: 447 C
White HEX: #ffffff RGB: (255,255,255) CMYK: (0,0,0,0) PMS: N/A

Secondary Color Palette

The secondary color palette should be used in conjunction with the primary colors to accent designs.

Hazy Blue HEX: #ebeff5 RGB: (235,239,245) CMYK: (4,2,0,4) PMS: 656 C
Steel Blue HEX: #aebfd4 RGB: (174,191,212) CMYK: (18,10,0,17) PMS: 651 C
Cadet Blue HEX: #728fb4 RGB: (114,143,180) CMYK: (37,21,0,29) PMS: 2157 C
Ocean Blue HEX: #254267 RGB: (37,66,103) CMYK: (64,36,0,60) PMS: 534 C
Space Blue HEX: #15263b RGB: (21,38,59) CMYK: (64,36,0,77) PMS: 289 C
Harbor Gray HEX: #ebebeb RGB: (235,235,235) CMYK: (0,0,0,8) PMS: 9345 C
Smoke Gray HEX: #adadad RGB: (173,173,173) CMYK: (0,0,0,32) PMS: Cool Gray 6 C
Anchor Gray HEX: #717171 RGB: (113,113,113) CMYK: (0,0,0,56) PMS: 424 C
Dark Gray HEX: #333333 RGB: (51,51,51) CMYK: (0,0,0,80) PMS: P 179-15 C
Slate Black HEX: #141414 RGB: (20,20,20) CMYK: (0,0,0,92) PMS: Black 6 C
Brand Guidance
If you have any questions regarding the DOW brand, please select a topic and fill out the form below.
General Use Questions
Design Questions
You can enter up to 1000 characters

Web Web

Placeholder for a 1-2 paragraph explanation of the vision for this design and any keywords people should keep in mind while designing.

Structure

Widths & Heights

Guidelines Here.

Margins & Paddings

Guidelines Here.

Columns

Guidelines Here.

Sectioned Elements

Guidelines Here.

Typography

Page (Evergreen) Headlines

Headline (h1) Font: Lato | Color: #333 | Font Weight:700 | Font Size: 2.6rem

Headline (h2) Font: Lato | Color: #333 | Font Weight:700 | Font Size: 2.2rem

Headline (h3) Font: Lato | Color: #333 | Font Weight:700 | Font Size: 2rem

Headline (h4) Font: Lato | Color: #333 | Font Weight:700 | Font Size: 1.8rem

Headline (h5) Font: Lato | Color: #333 | Font Weight:700 | Font Size: 1.6rem
Headline (h6) Font: Lato | Color: #333 | Font Weight:700 | Font Size: 1.4rem

Content (Explore) Headlines

Headline (h1) Font: "Crimson Text" | Color: #333 | Font Weight:700 | Font Size: 2rem

Headline (h2) Font: "Crimson Text" | Color: #333 | Font Weight:700 | Font Size: 1.8rem

Headline (h3) Font: "Crimson Text" | Color: #333 | Font Weight:700 | Font Size: 1.6rem

Headline (h4) Font: "Crimson Text" | Color: #333 | Font Weight:700 | Font Size: 1.4rem

Headline (h5) Font: "Crimson Text" | Color: #333 | Font Weight:700 | Font Size: 1.3rem
Headline (h6) Font: "Crimson Text" | Color: #333 | Font Weight:700 | Font Size: 1.2rem

Body Copy

This is body copy. (p). This is what an inline link will look like. "The world changed when you were about 5 years old, and we've been at war now for almost 16 years," he said. "Today, there are more than 100,000 airmen standing watch around the world. Many are directly supporting combat operations and are joined by thousands more soldiers, sailors and Marines."

This is the start of the next paragraph. The general stressed that the priority for the new officers changed today with their commissioning oath. "The focus is not on you any more. It is not about your GPA, your MPA or your PEA," he said, referring to their grade point, military performance and physical education averages. "It's not about the superintendent's pin on your uniform, and it's not about your accomplishments on the athletic field.

Color

Armed Forces Color Palette

Colors to be used when designing elements for the Armed Forces.

  • Army - Primary
    HEX: #ffffff RGB: (255,255,255) CMYK: (0,0,0,0)
    HEX: #EFF1EE RGB: (239,241,238) CMYK: (1,0,1,5)
    HEX: #ADBFB3 RGB: (173,191,179) CMYK: (9,0,6,25)
    HEX: #376251 RGB: (55,98,81) CMYK: (44,0,17,62)
    Army - Secondary
    HEX: #EE3B33 RGB: (238,59,51) CMYK: (0,75,79,7)
    HEX: #778C7F RGB: (119,140,127) CMYK: (15,0,9,45)
  • Marines - Primary
    HEX: #E7E4D7 RGB: (231,228,215) CMYK: (0,1,7,9)
    HEX: #C9BFA4 RGB: (201,191,164) CMYK: (0,5,18,21)
    HEX: #2F2D26 RGB: (47,45,38) CMYK: (0,4,19,82)
    HEX: #FFFFFF RGB: (255,255,255) CMYK: (0,0,0,0)
    Marines - Secondary
    HEX: #990F00 RGB: (153,15,0) CMYK: (0,90,100,40)
    HEX: #7B7B7B RGB: (123,123,123) CMYK: (0,0,0,52)
    HEX: #3D3B34 RGB: (47,8,22) CMYK: (0,3,15,76)
    HEX: #103065 RGB: (16,48,101) CMYK: (84,52,0,60)
  • Navy - Primary
    HEX: #998542 RGB: (153,133,66) CMYK: (0,13,57,40)
    HEX: #FFB81C RGB: (41,100,55) CMYK: (0,28,89,0)
    HEX: #002F6C RGB: (0,47,108) CMYK: (100,56,0,58)
    HEX: #000000 RGB: (0,0,0) CMYK: (0,0,0,100)
    Navy - Secondary
    HEX: #9EA2A2 RGB: (158,162,162) CMYK: (2,0,0,36)
    HEX: #FFFFFF RGB: (255,255,255) CMYK: (0,0,0,0)
    HEX: #AF272F RGB: (175,39,47) CMYK: (0,78,73,31)
    HEX: #73381D RGB: (115,56,29) CMYK: (0,51,75,55)
  • Air Force - Primary
    HEX: #efefef RGB: (239,239,239) CMYK: (0,0,0,6)
    HEX: #144A75 RGB: (20,74,117) CMYK: (83,37,0,54)
    HEX: #363636 RGB: (54,54,54) CMYK: (0,0,0,79)
    Air Force - Secondary
    HEX: #D31F09 RGB: (211,31,9) CMYK: (0,85,96,17)
    HEX: #FFFFFF RGB: (255,255,255) CMYK: (0,0,0,0)
  • Coast Guard - Primary
    HEX: #FFFFFF RGB: (255,255,255) CMYK: (0,0,0,0)
    HEX: #EDEDED RGB: (237,237,237) CMYK: (0,0,0,7)
    HEX: #133E68 RGB: (19,62,104) CMYK: (82,40,0,59)
    HEX: #355E92 RGB: (53,94,146) CMYK: (64,36,0,43)
    Coast Guard - Secondary
    HEX: #FF5000 RGB: (255,80,0) CMYK: (0,69,100,0)
    HEX: #EA1E01 RGB: (234,40,1) CMYK: (0,87,100,8)
    HEX: #6780AE RGB: (103,128,174) CMYK: (41,26,0,32)
    HEX: #327AB7 RGB: (50,122,183) CMYK: (73,33,0,28)
  • National Guard - Primary
    HEX: #00457C RGB: (0,69,124) CMYK: (100,44,0,51)
    HEX: #E51B24 RGB: (229,27,36) CMYK: (0,88,84,10)
    National Guard - Secondary
    HEX: #ffffff RGB: (255,255,255) CMYK: (0,0,0,0)
    HEX: #000000 RGB: (0,0,0) CMYK: (0,0,0,100)

Buttons

The following are the various button classes to be used on Defense.gov.

Default Default Ghost Primary Primary Ghost External Button

Cards

The following are the classes, and illustrated styling, used to achieve consistent box-shadows throughout Defense.gov.

Card
Card 1
Card 2
Card 3
Card 4
Card 5

Iconography

General

External Link
Download
Photo
Information**
Expand
Tags
Share
Embed
Chevron Left
Chevron Right
Chevron Up
Chevron Down
Calendar
Envelope
Default View
List View
Search Plus
Search Minus
Phone

Social

Twitter
Facebook
Flickr
LinkedIn
Instagram
YouTube
Podcast
RSS

Lists

Unordered List

Ordered List

Under Construction Banner

This will be used at the top of pages, mainly Experience pieces, that ned to go live for testing. *Note - There is extra padding at the top to account for the fixed site nav bar.

UNDER CONSTRUCTION

Play Button

[XXXXXXXXXXXXXXXXXXXX]

Helper Classes

Various CSS classes that should be used to add consistency and assist in various use cases.

Content Constraints

.content-wrap

Will constrain the element to be no wider than 1400px.

<div class="content-wrap"> ... </div>
.content-wrap-wide

Will constrain the element to be no wider than 1600px.

<div class="content-wrap-wide"> ... </div>

Page Banners

.page-banner & .page-banner-inner

Used for the banner of content pages.


Page Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer viverra tellus in ex ornare tempus.

<div class="page-banner" style="background-image:url(...);"> <div class="page-banner-inner"> <div class="content-wrap"> <h1 class="page-title">Page Title</h1> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer viverra tellus in ex ornare tempus.</p> </div> </div> </div>
.page-banner-thin

A variation of the banner for content pages, when a thin banner is needed.


Page Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer viverra tellus in ex ornare tempus.

<div class="page-banner page-banner-thin" style="background-image:url(...);"> <div class="page-banner-inner"> <div class="content-wrap"> <h1 class="page-title">Page Title</h1> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer viverra tellus in ex ornare tempus.</p> </div> </div> </div>

Illustrator Design File

[XXXXXXXXXXXXXXXXXXXX]

Print Print

[Insert short description here.]

Broadcast Broadcast

[Insert short description here/.]]

Logo Placement

[XXXXXXXXXXXXXXXXXXXX]

On Screen Stylized Text BIG

[XXXXXXXXXXXXXXXXXXXX]

On Screen Stylized Text Small w/ Background

[XXXXXXXXXXXXXXXXXXXX]

Captions on Screen

[XXXXXXXXXXXXXXXXXXXX]

Lower Thirds

[XXXXXXXXXXXXXXXXXXXX]

Title Safe & Action Safe

[XXXXXXXXXXXXXXXXXXXX]

Live Events Logo & Placement

[XXXXXXXXXXXXXXXXXXXX]

Minimum Font Sizing

[XXXXXXXXXXXXXXXXXXXX]