Branding Guidelines
Consistency is Key: Your Comprehensive Guide to Our Visual Identity.
Logos
The BitEscrow logo is an encapsulation of modernity, innovation, and security. Crafted using Ubuntu Bold Italic—the same font utilized by the iconic Bitcoin logo—our emblem immediately resonates with an audience savvy in the world of Bitcoin. The choice of this particular typeface isn't merely aesthetic; it subtly nods to the ethos of open-source culture and decentralization, echoing the core values of our platform.
When implementing the BitEscrow logo, it's imperative to maintain the capitalization of the 'B' and 'E' for visual coherence and brand recognition. If the logo is set against a graphical backdrop, prioritize legibility and high-contrast interplay to ensure optimal visibility. Our logo is available in a triad of curated color variants: Noir Black, Signature Blue, and Pristine White. When leveraging these hues, it's essential to pair each with its complementary background color to heighten visual impact. Specifically, deploy Noir Black and Signature Blue logos against a Pristine White canvas, while the Pristine White logo should be anchored on a backdrop of either Noir Black or Signature Blue.
When implementing the BitEscrow logo, it's imperative to maintain the capitalization of the 'B' and 'E' for visual coherence and brand recognition. If the logo is set against a graphical backdrop, prioritize legibility and high-contrast interplay to ensure optimal visibility. Our logo is available in a triad of curated color variants: Noir Black, Signature Blue, and Pristine White. When leveraging these hues, it's essential to pair each with its complementary background color to heighten visual impact. Specifically, deploy Noir Black and Signature Blue logos against a Pristine White canvas, while the Pristine White logo should be anchored on a backdrop of either Noir Black or Signature Blue.
Correct Usage
BitEscrow
BitEscrow
BitEscrow
These examples align seamlessly with our guidelines. They utilize the designated Ubuntu Bold Italic font and preserve the 'B' and 'E' capitalization for brand uniformity. Each employs one of our core color variants—Noir Black, Signature Blue, or Pristine White—and pairs it with a high-contrast background for optimal legibility and impact.
Wrong Usage
bitEscrow
bitescrow
BitEscrow
Contrary to our guidelines, these examples miss the mark on several fronts. They deviate from the prescribed Ubuntu Bold Italic font, undermining the consistent visual identity we aim for. Additionally, the 'B' and 'E' are incorrectly rendered, further diluting brand recognition. The colors veer away from our approved triad of Noir Black, Signature Blue, and Pristine White, creating visual dissonance. Lastly, the low-contrast pairings between the logo and its background compromise legibility and impact.
Colors
The frequent use of blue in our color schemes isn't merely an aesthetic choice; it is deeply rooted in color psychology. Blue is often associated with feelings of calmness and reliability. It's a color that evokes a sense of trust and security, making it particularly well-suited for a brand like ours, which prioritizes user safety and data integrity. The various shades of blue, from Azure to Sky Blue, enhance the user interface by introducing elements of vibrancy and dynamism, further evoking feelings of innovation and forward-thinking.
White, used in both our Dark Mode and Light Mode color schemes, acts as a balancing force against the boldness of blue. Psychologically, white is associated with purity, simplicity, and clarity. It offers a clean slate, both visually and emotionally, and brings focus to the elements around it. In our Light Mode scheme, the use of white creates a sense of openness and clarity, setting the stage for other elements to shine. In Dark Mode, it serves as a crisp counterpoint to the darker shades, ensuring readability and maintaining a minimalistic elegance.
By using these colors, we aim to subtly communicate our brand values of trustworthiness, innovation, and clarity, enhancing the overall user experience in a psychologically resonant manner.
White, used in both our Dark Mode and Light Mode color schemes, acts as a balancing force against the boldness of blue. Psychologically, white is associated with purity, simplicity, and clarity. It offers a clean slate, both visually and emotionally, and brings focus to the elements around it. In our Light Mode scheme, the use of white creates a sense of openness and clarity, setting the stage for other elements to shine. In Dark Mode, it serves as a crisp counterpoint to the darker shades, ensuring readability and maintaining a minimalistic elegance.
By using these colors, we aim to subtly communicate our brand values of trustworthiness, innovation, and clarity, enhancing the overall user experience in a psychologically resonant manner.
Light Mode
The Light Mode scheme brings an uplifting and airy feel to the interface. It combines a pure white background with subtle grays and two vibrant shades of blue, creating a bright and invigorating user environment.Pure White #FFFFFF
As the primary background, it sets the stage for clarity and openness.Soft Gray #F4F5F8
Utilized for secondary elements to reduce visual fatigue.Signature Blue #0068FD
Serve as the vibrant, energetic accents for interactive elements.Complimentary Blue #056BFE
Compliments signature blue, used for gradients and other elements.Slate Gray #292D34
Used primarily for text, providing contrast against the lighter backdrop.Dark Mode
The Dark Mode color scheme is a blend of luxurious blacks, muted grays, and a subtle blue, punctuated by a crisp white. This palette captures a sense of depth and sophistication, offering an elegant and focused visual environment for users who prefer a less glaring interface, particularly in low-light conditions.Base Black #131416
Serves as the primary background color, offering depth and sophistication.Charcoal Gray #2C2A2B
Used for secondary elements and to highlight features or details.Deep Sea Blue #1965AB
Accentuates and calls attention to key user interface elements.Crisp White #FEFFFE
Employed for text, ensuring readability against the darker shades.Muted Gray #161F1E
Provides a subtle complementary touch to round out the palette.Typography
As stated in the Logos section, our primary typeface is Ubuntu Bold Italic—the same striking font featured in the Bitcoin logo. This particular typeface serves as a bold proclamation of our brand's values, evoking a sense of innovation and technological prowess. It's a statement piece in our visual identity, playing a crucial role in immediately grabbing attention.
For our headers and general text, we employ Helvetica—a timeless classic known for its readability and clean lines. This typeface complements Ubuntu by adding a layer of simplicity and straightforwardness to our design. Its well-balanced and neutral design makes it incredibly versatile, making sure that the text is both beautiful to look at and easy to read.
For code snippets and technical sections, we've chosen Fira Code. This monospaced font is designed with functionality in mind, featuring programming ligatures that help clarify code and make it more readable. Its modern, clean design meshes well with our other type choices, ensuring a cohesive look and feel.
Altogether, the typography we've selected creates a seamless, coherent textual landscape. Ubuntu Bold Italic commands attention, Helvetica ensures readability, and Fira Code elevates technical content. These typefaces come together to offer a clean, modern, and highly functional text experience that aligns perfectly with our brand's ethos.
For our headers and general text, we employ Helvetica—a timeless classic known for its readability and clean lines. This typeface complements Ubuntu by adding a layer of simplicity and straightforwardness to our design. Its well-balanced and neutral design makes it incredibly versatile, making sure that the text is both beautiful to look at and easy to read.
For code snippets and technical sections, we've chosen Fira Code. This monospaced font is designed with functionality in mind, featuring programming ligatures that help clarify code and make it more readable. Its modern, clean design meshes well with our other type choices, ensuring a cohesive look and feel.
Altogether, the typography we've selected creates a seamless, coherent textual landscape. Ubuntu Bold Italic commands attention, Helvetica ensures readability, and Fira Code elevates technical content. These typefaces come together to offer a clean, modern, and highly functional text experience that aligns perfectly with our brand's ethos.
Logo Typeface
Ubuntu Bold Italic is more than just a typeface; it's a nod to the pioneering spirit that Bitcoin represents—a spirit our brand seeks to emulate. With its distinctive, eye-catching style, this font resonates with the audacious and the innovative. We foresee Ubuntu Bold Italic maintaining its visual allure for years to come, paralleling Bitcoin's enduring impact on the financial ecosystem. It's a font choice that doesn't merely look good; it speaks to our commitment to revolutionary change and lasting value.
bitcoin
BitEscrow
Primary Typeface
Originating in Switzerland, It was created by Swiss typeface designer Max Miedinger with input from Eduard Hoffmann in 1957. Helvetica naturally aligns with our brand ethos, which places a strong emphasis on neutrality and aesthetic excellence. Much like Switzerland's storied tradition of political and diplomatic neutrality, our company also maintains a stance of impartiality, ensuring fair and transparent transactions for all parties involved.
Helvetica's design reflects this commitment to neutrality by not imposing a mood or emotion, instead serving as a neutral vessel that lets the content and message shine. Its clean lines and balanced forms are a testament to Swiss design principles, echoing our own dedication to aesthetic harmony and detail. Together, these attributes create a cohesive and trustworthy visual language that speaks to our brand's core values.
Helvetica's design reflects this commitment to neutrality by not imposing a mood or emotion, instead serving as a neutral vessel that lets the content and message shine. Its clean lines and balanced forms are a testament to Swiss design principles, echoing our own dedication to aesthetic harmony and detail. Together, these attributes create a cohesive and trustworthy visual language that speaks to our brand's core values.
This is a Bold 700 Header
Sit pariatur Lorem excepteur cillum sint duis ullamco cillum. Voluptate magna ut aliqua deserunt ut exercitation. Laborum dolor qui consequat id pariatur. Deserunt magna eu anim sint cupidatat. Officia occaecat ullamco occaecat proident nisi. Ut aliqua consequat occaecat tempor ut occaecat eiusmod do sit ex dolor minim do culpa.
Monospace Typeface
Fira Code, created by designer Nikita Prokopov in 2015, is a monospaced font deeply rooted in the open-source community. It emerged as a specialized offshoot of the Fira Mono font, which in turn is part of Mozilla's Fira typeface family. Designed with an acute awareness of the challenges developers face, Fira Code features programming ligatures that optimize readability and comprehension of code.
The font captures attention by transforming standard multi-character programming sequences into individual, easily recognizable symbols. This innovative design choice not only reduces visual clutter but also streamlines the process of coding, making it more efficient. The font's elegant glyphs and balanced spacing offer an elevated aesthetic experience that is often missing in coding environments.
Because of its marriage of functionality and aesthetics, Fira Code has garnered a substantial following among developers since its introduction. Its thoughtful design elements contribute to a smooth, enjoyable coding experience. Integrating Fira Code into our brand identity communicates our commitment to technical precision and the highest standards of usability, while also forging a bond with the developer community that values similar principles.
The font captures attention by transforming standard multi-character programming sequences into individual, easily recognizable symbols. This innovative design choice not only reduces visual clutter but also streamlines the process of coding, making it more efficient. The font's elegant glyphs and balanced spacing offer an elevated aesthetic experience that is often missing in coding environments.
Because of its marriage of functionality and aesthetics, Fira Code has garnered a substantial following among developers since its introduction. Its thoughtful design elements contribute to a smooth, enjoyable coding experience. Integrating Fira Code into our brand identity communicates our commitment to technical precision and the highest standards of usability, while also forging a bond with the developer community that values similar principles.
In enim exercitation deserunt id aute. Qui ex eiusmod irure ullamco adipisicing consectetur laboris sunt culpa qui fugiat. Elit ea laborum voluptate aute ex esse consectetur voluptate ea voluptate. Magna cupidatat nisi enim ex sit nisi. Proident nostrud qui cillum consequat dolor aliquip pariatur. Officia laboris do reprehenderit et elit proident. Nulla ut aliqua sunt est minim. Culpa esse consectetur duis non eiusmod tempor id ullamco cillum eu ut.
Text Hierarchy
Our text hierarchy is carefully structured to guide the reader's eye and facilitate effortless comprehension. At the pinnacle of this hierarchy is the large header, set in a commanding font weight of 700 to capture immediate attention. Following the header, we employ a slightly smaller subheader, also in a font weight of 700, to introduce subtopics or nuanced elements within the content.
For the body text, we tone down the emphasis by using a lighter font weight of 400. This ensures readability while maintaining a pleasant text flow. Any code snippets featured in the content remain at their default font weight and include syntax coloring for better readability and differentiation.
It's crucial to note that the logo's specialized font, Ubuntu Bold Italic, is exclusive to the logo and should not appear anywhere in the text hierarchy. This exclusivity preserves the logo's unique identity and prevents any dilution of its impact.
For the body text, we tone down the emphasis by using a lighter font weight of 400. This ensures readability while maintaining a pleasant text flow. Any code snippets featured in the content remain at their default font weight and include syntax coloring for better readability and differentiation.
It's crucial to note that the logo's specialized font, Ubuntu Bold Italic, is exclusive to the logo and should not appear anywhere in the text hierarchy. This exclusivity preserves the logo's unique identity and prevents any dilution of its impact.
Page Header 50px Weight 700, 30px in mobile view.
Header 32px Weight 700, 24px in mobile view.
Subheader Header 24px Weight 700, 18px in mobile view.
Font size 18px on desktop, 14px in mobile view. Anim ad tempor minim consequat sit aliquip est. Ad adipisicing qui eu duis amet ex nisi laboris. Non ex enim duis est elit mollit consequat minim elit sunt est dolore ullamco ex. Lorem pariatur laborum aliquip commodo enim. Ut Lorem cupidatat excepteur elit aliqua Lorem mollit do pariatur aliqua esse.
Font size 18px on desktop, 14px in mobile view. Anim ad tempor minim consequat sit aliquip est. Ad adipisicing qui eu duis amet ex nisi laboris. Non ex enim duis est elit mollit consequat minim elit sunt est dolore ullamco ex. Lorem pariatur laborum aliquip commodo enim. Ut Lorem cupidatat excepteur elit aliqua Lorem mollit do pariatur aliqua esse. Minim dolor incididunt commodo adipisicing voluptate voluptate eu mollit occaecat consectetur quis. Fugiat ipsum laboris ullamco cupidatat sint.
Brand Icon
Our brand icon is a singular, cohesive visual element that plays a crucial role in our brand identity. The icon consists of a vibrant gradient blue background, merging shades #3F83E4 and #0068FD, creating a dynamic and modern aesthetic. Emblazoned across this blue gradient is the first lette of our brand name, crafted in Ubuntu Bold Italic font.
Sized at 1000 x 1000 pixels with a generous corner radius of 250px, the brand icon possesses a balanced and contemporary look, suitable for various applications across different media. Most importantly, this brand icon is standardized and consistent across all departments within our company, from agents to developers to our app. There are no variations, ensuring a unified brand image that is easily recognizable and serves as a testament to our commitment to consistency and excellence.
Sized at 1000 x 1000 pixels with a generous corner radius of 250px, the brand icon possesses a balanced and contemporary look, suitable for various applications across different media. Most importantly, this brand icon is standardized and consistent across all departments within our company, from agents to developers to our app. There are no variations, ensuring a unified brand image that is easily recognizable and serves as a testament to our commitment to consistency and excellence.
Proportion Methods
In the realm of design, simplicity reigns supreme. Our proportion methods embrace this fundamental principle, highlighting the power of minimalist design structures. Central to our approach is the art of centering. Proper centering provides a visual anchor, drawing the viewer's attention directly to the focal point, thereby ensuring our message is clear and resonant. When elements are meticulously centered, they exude a sense of equilibrium and harmony. This meticulous alignment not only enhances aesthetics but also reinforces our brand's commitment to precision and clarity.
The first image is a masterclass in balanced design. The 'BitEscrow' logo is expertly centered both vertically and horizontally, ensuring a commanding presence. Equally important is the harmonious width shared by both the logo and its tagline 'Spend Bitcoin Safely.' This symmetrical design approach not only promotes clarity but also projects a sense of stability and trustworthiness inherent to our brand.
The second image portrays a crucial misstep: the logo and tagline are not aligned in terms of width. The tagline extends beyond the width of the logo, causing a visual misalignment. This discrepancy disrupts the visual flow, making the design appear less cohesive and potentially confusing to viewers.
In the last Image, the 'BitEscrow' logo is inappropriately scaled, dwarfing the tagline below it. Additionally, the vertical centering is off-kilter, pushing the tagline uncomfortably close to the edge. This misalignment and mismatched sizing diminish the unity between the logo and tagline, undermining the brand's intended message and aesthetic coherence.
The second image portrays a crucial misstep: the logo and tagline are not aligned in terms of width. The tagline extends beyond the width of the logo, causing a visual misalignment. This discrepancy disrupts the visual flow, making the design appear less cohesive and potentially confusing to viewers.
In the last Image, the 'BitEscrow' logo is inappropriately scaled, dwarfing the tagline below it. Additionally, the vertical centering is off-kilter, pushing the tagline uncomfortably close to the edge. This misalignment and mismatched sizing diminish the unity between the logo and tagline, undermining the brand's intended message and aesthetic coherence.
Law for Clear Space
Within our clear spacing guidelines, the BitEscrow logo and its tagline are the central and exclusive elements permitted within the graphic. No other images, graphics, or visual distractions should surround, overlay, or intrude upon this primary duo. The only exception to this rule is the inclusion of a partnership company logo. Furthermore, the background of any such graphic should strictly adhere to the parameters set in the logo section, ensuring uniformity and preserving the integrity of the BitEscrow brand identity.
Horizontal Padding
In the first image, the BitEscrow logo's horizontal alignment demonstrates the critical principle of maintaining a balanced cushion on either side. This stipulates that there should be a minimum of half of the logo's width reserved as clear space on both the left and right. For the visual presented, this translates to a generous 200px buffer on each side, ensuring that the logo remains distinctly isolated and doesn't merge with other visual elements.
Vertical Padding
The second representation emphasizes the vertical clearance necessary for the BitEscrow logo. Similar to the horizontal guideline, the top and bottom also necessitate a minimum 2x spacing of the logo's height. This vertical spacing ensures that the logo stands tall, unaffected by any potential crowding from surrounding elements, thereby retaining its prominence.
Partnership Annotations
When introducing another brand or company name in conjunction with the BitEscrow logo, as shown in the third image, it's imperative to maintain the clear space integrity. The top and bottom spacing should persistently adhere to the 1/2 rule, ensuring that both the BitEscrow logo and the associated company name receive their due prominence without any visual overlap or crowding.
Correct Usage:
Wrong Usage
Need to learn more about our guidelines?
Ask our team in the Discord server!
Ask our team in the Discord server!