Block Foundation

Brand Assets & Visual Identity Guide

Contents

• Style Guide
• Logo
• Typography
• Color
• Graphics
• Diagrams
• Elements
• Frameworks
• Templates
• Syntax
• Colophon

Welcome to the official Brand Repository of the Block Foundation – Let's together uphold and amplify the voice of change in the world of architecture!

Introduction

This repository is an all-inclusive resource of our brand identity, encapsulating our ethos, vision, and the graphical elements that distinguish us in the global arena of architectural innovation.

Our brand is not just a logo or a name, but a reflection of our mission to revolutionize architecture through blockchain technology. It symbolizes our commitment to facilitating a sustainable, equitable, and dynamic housing market that balances the interests of all stakeholders.

This repository hosts a comprehensive collection of our branding materials — from our logo in various formats to color palettes, typography guidelines, official stationary templates, and presentation layouts. Each element is meticulously designed to communicate our essence, ensuring a cohesive and consistent representation of the Block Foundation across all platforms.

We invite our community, collaborators, and media personnel to use this repository as a guide when representing the Block Foundation. Whether you're creating content for us, collaborating on a project, or featuring our work, these resources will ensure you accurately capture and convey the spirit of our organization.

We kindly ask that you adhere to the guidelines detailed in this repository to maintain the integrity of our brand. And remember, our brand is not just an identifier but a promise of the transformative potential blockchain holds for the architectural landscape.

Style Guide

Will be provided shortly.

Logo

(Back to top)

Logomark

| Variant | PNG | SVG | WEBP | JPG | | :---------- | ----- | ----- | ----- | ----- | | dark | | | | | | dark transparant | | | | | | gray | | | | | | gray transparant | | | | | | light | | | | | | light transparant | | | | |

Logotype

Will be provided shortly.

Favicon

Badge

Share that your organisation or project endorses the Block Foundation by adding our badge to your readme or website.

Will be provided shortly.

ASCII Art

``` txt

.............................................................................

.............................................................................

....................................@@@......................................

................................@@@@@@@@@@@..................................

............................@@@@@@..@@@..@@@@@@..............................

........................@@@@@@......@@@......@@@@@@..........................

...................@@@@@@...........@@@..........,@@@@@@.....................

...............@@@@@@...............@@@...............@@@@@@.................

...........@@@@@@...................@@@...................@@@@@@.............

.........@@@@@@.....................@@@.....................@@@@@@...........

.........@@@.@@@@@@.................@@@.................@@@@@@.@@@...........

.........@@@.....@@@@@@.............@@@.............@@@@@@.....@@@...........

.........@@@.........@@@@@@@........@@@........@@@@@@@.........@@@...........

.........@@@..............@@@@@@....@@@....@@@@@@..............@@@...........

.........@@@..................@@@@@@@@@@@@@@@..................@@@...........

.........@@@......................@@@@@@@......................@@@...........

.........@@@........................@@@........................@@@...........

.........@@@........................@@@........................@@@...........

.........@@@........................@@@........................@@@...........

.........@@@........................@@@........................@@@...........

.........@@@........................@@@........................@@@...........

.........@@@@.......................@@@.......................@@@@...........

...........@@@@@@...................@@@...................@@@@@@.............

...............@@@@@@...............@@@...............@@@@@@.................

...................@@@@@@...........@@@...........@@@@@@.....................

........................@@@@@@......@@@......@@@@@@..........................

............................@@@@@@..@@@..@@@@@@..............................

................................@@@@@@@@@@@..................................

....................................@@@......................................

.............................................................................

.............................................................................

```

txt ........................................................................ ..................@................. . ...............@@@@@@@.............. BLOCK FOUNDATION . ...........@@@....@....@@@.......... . .......@@@........@........@@@...... www.blockfoundation.io . ......@@@@........@........@@@@..... info@blockfoundation.io . ......@.....@@@...@...@@@.....@..... . ......@.........@@@@@.........@..... . ......@...........@...........@..... . ......@...........@...........@..... . ......@...........@...........@..... . .........@@@......@......@@@........ . .............@@@..@..@@@............ . ..................@................. . ........................................................................

Typography

Main Display Font

We us Barlow.

• Creators: Jeremy Tribby (Principal Design) and Nguyễn Hồng Nhung (Vietnamese)
• Repository: jpt/barlow
• License: OFL
• GIF courtesy of the original creators.

Secondary Font

Will be provided shortly.

Text Conventions

Brand Name

Capitalize the "B" and "F" in "Block Foundation" in all copy text. The Block Foundation should only be presented in all uppercase when displayed in our official logos; e.g.: "BLOCK FOUNDATION". In code, "block_foundation" is all lowercase / snakecase.

• ✓ BLOCK FOUNDATION (in Logo)
• ✓ Block Foundation (in Text)
• ✓ block_foundation (in Code)
• × BlockFoundation
• × blockFoundation
• × Block-Foundation
• × block-foundation
• × block foundation

Headers

All headers are written in Title Case.

Emoji's

We don't use them, ever.

Color

Base Colors

| | Color | HEX | RGB | HSL | HSB | CMYK | | --------- | --------- | --------- | --------- | --------- | --------- | --------- | | | Base 01 | #041B26 | 4, 27, 38 | 199, 81%, 8% | 200, 90, 15 | 13%, 4%, 0%, 85% | | | Base 02 | #E1E4E5 | 225, 228, 229 | 195, 7%, 89% | 200, 2, 90 | 2%, 0%, 0%, 10% | | | Base 03 | #F0F1F2 | 240, 241, 242 | 210, 7%, 95% | 200, 1, 95 | 1%, 0%, 0%, 5% | | | Base 04 | #FFFFFF | 255, 255, 255 | 0, 0%, 100% | 0, 0, 0 | 0%, 0%, 0%, 0% |

Secondary Colors

Will be provided shortly.

Graphics

Artworks

Our repositories use the following artworks to make them just a little bit moe enticing!

| Color | Monochrome | Acccent | | ----- | ---------- | ------- | | structure-03-color | structure-03-mono | structure-03-accent |

Photography

Will be provided shortly.

Banners

Will be provided shortly.

Diagrams

We use Mermaid in our repositories for simple data and process visualisations. Some examples:

Flowchart

mermaid flowchart LR Light:::class_light --> Neutral:::class_neutral --> Dark:::class_dark classDef class_light fill:#FFFFFF,color:#041B26,stroke:#041B26,stroke-width:2px; classDef class_neutral fill:#E1E4E5,color:#041B26,stroke:#041B26,stroke-width:2px; classDef class_dark fill:#041B26,color:#FFFFFF,stroke:#041B26,stroke-width:2px;

class_light

md classDef class_light fill:#FFFFFF,color:#041B26,stroke:#041B26,stroke-width:2px;

class_neutral

md classDef class_neutral fill:#E1E4E5,color:#041B26,stroke:#041B26,stroke-width:2px;

class_dark

md classDef class_dark fill:#041B26,color:#FFFFFF,stroke:#041B26,stroke-width:2px;

Pie chart

mermaid %%{init: {"theme": "base", "pie": {"textPosition": 0.5}, "themeVariables": { "pieOuterStrokeWidth": "2px", "pie1": "#FFFFFF", "pie2": "#E1E4E5", "pie3": "#041B26"}}}%% pie title Crypto "Bitcoin" : 386 "Ethereum" : 85 "Algorand" : 15

md %%{init: {"theme": "base", "pie": {"textPosition": 0.5}, "themeVariables": { "pieOuterStrokeWidth": "2px", "pie1": "#FFFFFF", "pie2": "#E1E4E5", "pie3": "#041B26"}}}%%

Elements

Icons

Within our repositories we use simple-icons for most iconographic purposes. This brand repository includes a copy this icon set (downloaded per 2023-07-25): /src/icons/simple-icons/

• simple-icons website: simpleicons.org
• simple-icons reposiory: github.com/simple-icons/simple-icons
• simple-icons license: CC0 1.0 Universal

IO Shields

We use IO Shields combined with simple-icons to display repository information.

Parameters

| Field | Value | Description | | :-------------- | :-------------- | :---------- | | style | flat-square | | | logo | bitcoin | Named logo via simple-icons | | logoColor | #FFFFFF | All white logo to match the text color | | label | License: | Title caps label text | | labelColor | #041B26 | Completely dark background | | color | #041B26 | | | cacheSeconds | default | | | link | misc. | Always try to provide a link |

Shields

| | | shield.io url | simpleicons tag | | :-------------------- | :---- | :---- | :---- | | License | | /badges/git-hub | readthedocs | | Docker Pulls | | docker | | Docker Stars | | /badges/docker-stars | docker | | Docker Version | | /badges/docker-stars | docker | | Docker Size | | /badges/docker-image-size-tag | docker | | devContainer | | /badges | visualstudiocode | | DOI | | /badges | DOI | | Zotero | | /badges | Zotero | | Download | | /badges | files | | Solidity | | /badges | Solidity | | Teal | | /badges | Algorand | | Substrate | | /badges | paritysubstrate | | Hyperledger | | /badges | Hyperledger |

Repository Headers

All repositories include the basic header, in some cases combined with additional shields.

Basic Repository Header

Basic Repository Interactions

Docker Container Repository Header

LaTeX / Citation Repository Header

TypeScript / NPM Repository Header

Python / PyPi Repository Header

Frameworks

SCSS

We use the Stylescape SCSS Framework developed by Scape Agency® for all our online content.

• Website: scape.style
• Repository: github.com/scape-agency/stylescape

HTML Script Tag

html <script src="https://unpkg.com/stylescape@latest/dist.min.js"></script>

NPM Module

bash npm i stylescape

Templates

Presentation Template

Will be provided shortly.

Contents

• PDF
• Keynote
• PowerPoint

Customize

1. Requires Keynote to edit
2. Install the fonts here
3. Replace the for-placement-only images by dragging new images onto them
4. Fill out your name, Twitter, and other details as you see fit.
5. Create new slides to fit your talk

Figma Template

For those who use Figma, we have included a template that can be used to create a new project. This template has Color Presets and some of the most common components.

Duplicate the template and rename it to your project name.

Will be provided shortly.

HTML Email Signature Templates

Always in plain simple text.

``` txt □ BLOCK FOUNDATION

  Lars van Vianen
  lars@blockfoundation.io

  www.blockfoundation.io
  info@blockfoundation.io

```

Will be provided shortly.

Syntax

General

Superseding Conventions:

• We use 4 spaces for indents
• We use a maximum line length of 79 characters in all languages (as per PEP8)
• Strings should be quoted with double-quotes instead of single-quotes.
• Surround operators with a single space on either side.

Style Guides

| Language | Convention | | :------------------ | :--------- | | Go | Google Go Style Guide | | Go | Uber Go Style Guide | | JavaScript | Airbnb JavaScript Style Guide | | JavaScript | Google JavaScript Style Guide | | Python | Google Python Style Guide | | Solidity | Solidity Style Guide | TypeScript | Google TypeScript Style Guide |

Colophon

Development Resources

Version

This documentation is in version v0.0.1. Last edited: 07/2023

Authors

This is an open-source project by the Block Foundation.

The Block Foundation mission is enabling architects to take back initiative and contribute in solving the mismatch in housing through blockchain technology. Therefore the Block Foundation seeks to unschackle the traditional constraints and construct middle ground between rent and the rigidity of traditional mortgages.

website: www.blockfoundation.io

Contributing

We'd love for you to contribute and to make this project even better than it is today! Please refer to the contribution guidelines for information.

Legal Information

Copyright

Copyright © 2023 Stichting Block Foundation. All Rights Reserved.

License

Except as otherwise noted, the content in this repository is licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) License, and code samples are licensed under the Apache 2.0 License.

Also see LICENSE and LICENSE-CODE.

Disclaimer

THIS SOFTWARE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.