The following basic collection of examples and best practices will help you contribute to the consistency of the KLDiscovery and Ontrack brands while considering the necessary global legal requirements.
Corporate Identity
As KLDiscovery continues to expand and evolve, it is necessary to clearly articulate our brand architecture. If you are a vendor or partner using any of the following brands, please adhere to a consistent and accurate use in all instances.
Color
Primary Colors
These two primary colors should be the foundation of any KLDiscovery branded designs.
KLD Corporate Blue
Accent color, banner floods and buttons.
HEX #0056b8
rgb (0, 86, 184)
Pantone 2935
Text
Default text color for body text and headlines.
HEX #212527
RGB (33, 37, 39)
Accent Colors
The secondary UI colors are reserved for buttons, call outs and icons.
Green
HEX #94d60a
rgb (148, 214, 10)
Yellow
HEX #fec524
rgb (254, 197, 36)
Red
HEX #ec0b43
rgb (236, 11, 67)
Orange
HEX #f18903
rgb (241, 137, 3)
Purple
HEX #9363cd
rgb (147, 99, 205)
Gray
HEX #ebebeb
rgb (235, 235, 235)
Typography
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
Roboto
Used in headlines, leads, regular text, buttons, navigation, etc.
Examples:
Roboto Thin
Roboto Thin Italic
Roboto Bold
Note: This is the corporate web font only. Not intended for use in materials outside the web.
Text Hierarchy
Creating hierarchy within typography is key for emphasizing the most important messages and more importantly establishing SEO structure that aids in healthy search engine placement.
Headline sentence case
Lead text. Nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.
Body text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ultricies massa eros, quis sagittis lacus auctor at. Nullam pharetra porta eros ac lobortis. Fusce ac dolor enim. Nullam eu justo quis orci egestas posuere sed quis quam. Donec mattis turpis sed molestie rutrum.
Button text exampleHeading 1
Heading 2
Heading 3
Heading 4
Lead text
Paragraph text
The following snippet of text is rendered as bold text.
The following snippet of text is rendered as italicized text.
This line of text is meant to be treated as fine print (small).
Form Usage
Form elements are very important webparts for the KLDiscovery line of business. They serve as a key service contact point and customer interface features for both the ediscovery and managed review divisions.
Full Container Form Example
Two Column Form Example
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. Fusce ac turpis quis ligula lacinia aliquet. Mauris ipsum. Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, nibh.
Quisque volutpat condimentum velit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam nec ante. Sed lacinia, urna non tincidunt mattis, tortor neque adipiscing diam, a cursus ipsum ante quis turpis. Nulla facilisi. Ut fringilla. Suspendisse potenti. Nunc feugiat mi a tellus consequat imperdiet. Vestibulum sapien. Proin quam. Etiam ultrices. Suspendisse in justo eu magna luctus suscipit. Sed lectus.
Integer euismod lacus luctus magna. Quisque cursus, metus vitae pharetra auctor, sem massa mattis sem, at interdum magna augue eget diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi lacinia molestie dui. Praesent blandit dolor. Sed non quam. In vel mi sit amet augue congue elementum. Morbi in ipsum sit amet pede facilisis laoreet. Donec lacus nunc, viverra nec, blandit vel, egestas et, augue. Vestibulum tincidunt malesuada tellus. Ut ultrices ultrices enim. Curabitur sit amet mauris.
Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Integer lacinia sollicitudin massa. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue. Proin sodales libero eget ante. Nulla quam. Aenean laoreet.
Iconography
All KLDiscovery web properties use a custom font-based glyph library available for placement within the CMS editor. If a custom icon is needed, please complete a JIRA task and the design team will create per spec. Icon colors are controlled via CSS that is easily applied within the WYSIWYG editor.