2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00

big brand update

This commit is contained in:
Mark Otto
2013-12-27 14:04:44 -08:00
parent 87288da72c
commit 84326a3e59
3 changed files with 126 additions and 37 deletions
+43 -5
View File
@@ -13,17 +13,55 @@ base_url: "../"
<div class="page-header">
<h1 id="brand">Brand guidelines</h1>
</div>
<p class="lead">Interested in using Bootstrap's brand resources? Great! We have only a few guidelines we ask you to follow.</p>
<p class="lead">Have a need for Bootstrap's brand resources? Great! We have only a few guidelines we follow, and in turn ask you to follow as well. These guidelines were inspired by Mailchimp's <a href="http://mailchimp.com/about/brand-assets/" target="_blank">Brand Assets</a>.</p>
<h2>Logo</h2>
<p>Extremely simple in that it's pure web type, Bootstrap's logo (if you want to call it that) should only appear as Helvetica Neue Bold. You may display it in full as Bootstrap or abbreviated as a capitalized "B". <strong>Do not use the Twitter bird.</strong></p>
<div class="bs-example bs-brand">
<h1>Bootstrap</h1>
<h2>Mark and logo</h2>
<p>Use either the Bootstrap mark (a capital <strong>B</strong>) or the standard logo (just <strong>Bootstrap</strong>). It should always appear in Helvetica Neue Bold. <strong>Do not use the Twitter bird</strong> in association with Bootstrap.</p>
<div class="bs-brand-logos">
<div class="bs-brand-item">
<div class="bs-booticon bs-booticon-lg">B</div>
</div>
<div class="bs-brand-item inverse">
<div class="bs-booticon bs-booticon-lg bs-booticon-inverse">B</div>
</div>
</div>
<div class="bs-brand-logos">
<div class="bs-brand-item">
<h1>Bootstrap</h1>
</div>
<div class="bs-brand-item inverse">
<h1>Bootstrap</h1>
</div>
</div>
<h2>Name</h2>
<p>The project and framework should always be referred to as <strong>Bootstrap</strong>. No Twitter before it, no capital <em>s</em>, and no abbreviations save for one, a capital <strong>B</strong>.</p>
<div class="bs-brand-logos">
<div class="bs-brand-item">
<h3>Bootstrap</h3>
<span class="glyphicon glyphicon-ok"></span>
</div>
<div class="bs-brand-item">
<h3 class="text-muted">BootStrap</h3>
<span class="glyphicon glyphicon-remove"></span>
</div>
<div class="bs-brand-item">
<h3 class="text-muted">Twitter Bootstrap</h3>
<span class="glyphicon glyphicon-remove"></span>
</div>
</div>
<h2>Colors</h2>
<p>Our docs and branding use a handful of primary colors to differentiate what <em>is</em> Bootstrap from what <em>is in</em> Bootstrap. In other words, if it's purple, it's representative of Bootstrap.</p>
<div class="bs-brand">
<div class="color-swatches">
<div class="color-swatch bs-purple"></div>
<div class="color-swatch bs-purple-light"></div>
<div class="color-swatch bs-purple-lighter"></div>
<div class="color-swatch bs-gray"></div>
</div>
</div>
</div>