index.html 42.2 KB
Newer Older
Thomas Park's avatar
Thomas Park committed
1
2
3
4
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
XhmikosR's avatar
XhmikosR committed
5
6
    <title>Bootswatch: Free themes for Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
7
    <link rel="stylesheet" href="./flatly/bootstrap.css" media="screen">
Thomas Park's avatar
Thomas Park committed
8
9
    <link rel="stylesheet" href="./bower_components/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="./assets/css/bootswatch.min.css">
10
11
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
12
13
      <script src="./bower_components/html5shiv/dist/html5shiv.js"></script>
      <script src="./bower_components/respond/dest/respond.min.js"></script>
14
    <![endif]-->
XhmikosR's avatar
XhmikosR committed
15
    <script>
Thomas Park's avatar
Thomas Park committed
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

     var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-23019901-1']);
      _gaq.push(['_setDomainName', "bootswatch.com"]);
        _gaq.push(['_setAllowLinker', true]);
      _gaq.push(['_trackPageview']);

     (function() {
       var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
       ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
       var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
     })();

    </script>
  </head>
  <body>
Thomas Park's avatar
Thomas Park committed
32
    <div class="navbar navbar-default navbar-fixed-top">
Thomas Park's avatar
Thomas Park committed
33
      <div class="container">
Thomas Park's avatar
Thomas Park committed
34
35
36
37
38
39
40
41
42
        <div class="navbar-header">
          <a href="./" class="navbar-brand">Bootswatch</a>
          <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div class="navbar-collapse collapse" id="navbar-main">
Thomas Park's avatar
Thomas Park committed
43
44
45
46
          <ul class="nav navbar-nav">
            <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="themes">Themes <span class="caret"></span></a>
              <ul class="dropdown-menu" aria-labelledby="themes">
Thomas Park's avatar
Thomas Park committed
47
                <li><a href="./default/">Default</a></li>
Thomas Park's avatar
Thomas Park committed
48
                <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
49
50
51
52
                <li><a href="./amelia/">Amelia</a></li>
                <li><a href="./cerulean/">Cerulean</a></li>
                <li><a href="./cosmo/">Cosmo</a></li>
                <li><a href="./cyborg/">Cyborg</a></li>
Thomas Park's avatar
Thomas Park committed
53
                <li><a href="./darkly/">Darkly</a></li>
Thomas Park's avatar
Thomas Park committed
54
55
56
57
58
59
60
61
62
63
                <li><a href="./flatly/">Flatly</a></li>
                <li><a href="./journal/">Journal</a></li>
                <li><a href="./lumen/">Lumen</a></li>
                <li><a href="./readable/">Readable</a></li>
                <li><a href="./simplex/">Simplex</a></li>
                <li><a href="./slate/">Slate</a></li>
                <li><a href="./spacelab/">Spacelab</a></li>
                <li><a href="./superhero/">Superhero</a></li>
                <li><a href="./united/">United</a></li>
                <li><a href="./yeti/">Yeti</a></li>
Thomas Park's avatar
Thomas Park committed
64
65
              </ul>
            </li>
Thomas Park's avatar
Thomas Park committed
66
67
            <li>
              <a href="./help/">Help</a>
Thomas Park's avatar
Thomas Park committed
68
69
70
71
72
73
            </li>
            <li>
              <a href="http://news.bootswatch.com">Blog</a>
            </li>
          </ul>

Thomas Park's avatar
Thomas Park committed
74
          <ul class="nav navbar-nav navbar-right">
Thomas Park's avatar
Thomas Park committed
75
76
77
78
79
80
81
82
83
84
85
            <li><a href="http://builtwithbootstrap.com/" target="_blank">Built With Bootstrap</a></li>
            <li><a href="https://wrapbootstrap.com/?ref=bsw" target="_blank">WrapBootstrap</a></li>
          </ul>

        </div>
      </div>
    </div>

    <div class="splash">
      <div class="container">

Thomas Park's avatar
Thomas Park committed
86
87
        <div class="row">
          <div class="col-lg-12">
Chris Rebert's avatar
Chris Rebert committed
88
            <h1>Free themes for Bootstrap</h1>
Thomas Park's avatar
Thomas Park committed
89
90
            <div id="social">
              <span>
91
92
                <iframe id="gh-fork" src="http://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=fork" allowtransparency="true" frameborder="0" scrolling="0" width="53" height="20"></iframe>
                <iframe id="gh-star" src="http://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
Thomas Park's avatar
Thomas Park committed
93
94
95
96
97
98
              </span>
              <span>
                <a href="https://twitter.com/thomashpark" class="twitter-follow-button" data-show-count="false" data-show-screen-name="true">Follow @thomashpark</a>
                <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://bootswatch.com" data-via="thomashpark">Tweet</a>
              </span>
            </div>
Thomas Park's avatar
Thomas Park committed
99
100
            <div class="row">
              <div class="col-md-6 col-md-offset-3">
Thomas Park's avatar
Thomas Park committed
101
102
                <div class="sponsor">
                  <a href="http://www.shopify.com/?ref=bootswatch" target="_blank"><img src="assets/img/shopify.png" alt="Shopify"></a>
Thomas Park's avatar
Thomas Park committed
103
                </div>
Thomas Park's avatar
Thomas Park committed
104
              </div>
Thomas Park's avatar
Thomas Park committed
105
            </div>
Thomas Park's avatar
Thomas Park committed
106
          </div>
Thomas Park's avatar
Thomas Park committed
107
108
109
110
111
112
113
114
115
        </div>

      </div>
    </div>

    <div class="section-tout">
      <div class="container">

        <div class="row">
Thomas Park's avatar
Thomas Park committed
116
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
117
            <h3><i class="fa fa-file-o"></i> Easy to Install</h3>
Thomas Park's avatar
Thomas Park committed
118
119
            <p>Simply download a CSS file and replace the one in Bootstrap. No messing around with hex values.</p>
          </div>
Thomas Park's avatar
Thomas Park committed
120
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
121
            <h3><i class="fa fa-github"></i> Open Source</h3>
Thomas Park's avatar
Thomas Park committed
122
            <p>Bootstrap themes are released under the MIT License and maintained by the community on <a target="_blank" href="https://github.com/thomaspark/bootswatch">GitHub</a>.</p>
Thomas Park's avatar
Thomas Park committed
123
          </div>
Thomas Park's avatar
Thomas Park committed
124
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
125
            <h3><i class="fa fa-wrench"></i> Tuned for 3.2.0</h3>
Thomas Park's avatar
Thomas Park committed
126
            <p>Themes are built for the latest version of Bootstrap. <a href="2/">Version 2.3.2</a> and <a target="_blank" href="https://github.com/thomaspark/bootswatch/tags">others</a> are also available to download.</p>
Thomas Park's avatar
Thomas Park committed
127
          </div>
Thomas Park's avatar
Thomas Park committed
128
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
129
            <h3><i class="fa fa-cogs"></i> Modular</h3>
Thomas Park's avatar
Thomas Park committed
130
131
             <p>Changes are contained in just two LESS files, enabling modification and ensuring forward compatibility.</p>
          </div>
Thomas Park's avatar
Thomas Park committed
132
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
133
            <h3><i class="fa fa-cloud"></i> Get Plugged In</h3>
134
            <p>An <a href="./help/#api">API</a> is available for integrating with your platform. In use by <a href="https://nodebb.org/" target="_blank">NodeBB</a>, <a href="http://yabdab.com/stacks/bootsnap" target="_blank">BootSnap</a>, and others.</p>
Thomas Park's avatar
Thomas Park committed
135
          </div>
Thomas Park's avatar
Thomas Park committed
136
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
137
            <h3><i class="fa fa-bullhorn"></i> Stay Updated</h3>
XhmikosR's avatar
XhmikosR committed
138
            <p>Be notified about updates by subscribing via <a href="http://feeds.feedburner.com/bootswatch">RSS feed</a>, <a href="http://feedburner.google.com/fb/a/mailverify?uri=bootswatch&amp;loc=en_US">email</a>, or <a href="http://news.bootswatch.com" onclick="pageTracker._link(this.href); return false;">Tumblr</a>.</p>
Thomas Park's avatar
Thomas Park committed
139
140
          </div>
        </div>
Thomas Park's avatar
Thomas Park committed
141

Thomas Park's avatar
Thomas Park committed
142
143
144
145
146
147
148
      </div>
    </div>

    <div class="section-preview">
      <div class="container">
        <div class="row">

Thomas Park's avatar
Thomas Park committed
149
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
150
151
152
153
154
155
156
            <div class="preview">
              <div class="image">
                <a href="amelia/"><img src="amelia/thumbnail.png" class="img-responsive" alt="Amelia"></a>
              </div>
              <div class="options">
                <h3>Amelia</h3>
                <p>Sweet and cheery</p>
Thomas Park's avatar
Thomas Park committed
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
                <div class="btn-group"><a class="btn btn-info" href="amelia/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="amelia/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="amelia/bootstrap.min.css"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="amelia/bootstrap.css"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="amelia/variables.less"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="amelia/bootswatch.less"
                      onClick="_gaq.push(['_trackEvent', 'bootswatch', 'amelia', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
174
175
176
177
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
178
179

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
180
181
182
183
184
185
            <div class="preview">
              <div class="image">
                <a href="cerulean/"><img src="cerulean/thumbnail.png" class="img-responsive" alt="Cerulean"></a>
              </div>
              <div class="options">
                <h3>Cerulean</h3>
Thomas Park's avatar
Thomas Park committed
186
                <p>A calm blue sky</p>
Thomas Park's avatar
Thomas Park committed
187
188
189
190
191
192
193
194
195
196
197
198
199
                <div class="btn-group"><a class="btn btn-info" href="cerulean/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="cerulean/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="cerulean/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="cerulean/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="cerulean/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="cerulean/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cerulean', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
200
201
202
203
204
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
205
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
206
207
208
209
210
211
            <div class="preview">
              <div class="image">
                <a href="cosmo/"><img class="img-responsive" src="cosmo/thumbnail.png" alt="Cosmo"></a>
              </div>
              <div class="options">
                <h3>Cosmo</h3>
Thomas Park's avatar
Thomas Park committed
212
213
214
215
216
217
218
219
220
221
222
223
224
225
                <p>An ode to Metro</p>
                <div class="btn-group"><a class="btn btn-info" href="cosmo/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="cosmo/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="cosmo/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="cosmo/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="cosmo/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="cosmo/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cosmo', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
226
227
228
229
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
230

231
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
232
233
234
235
236
237
            <div class="preview">
              <div class="image">
                <a href="cyborg/"><img class="img-responsive" src="cyborg/thumbnail.png" alt="Cyborg"></a>
              </div>
              <div class="options">
                <h3>Cyborg</h3>
Thomas Park's avatar
Thomas Park committed
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
                <p>Jet black and electric blue</p>
                <div class="btn-group"><a class="btn btn-info" href="cyborg/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="cyborg/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="cyborg/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="cyborg/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="cyborg/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="cyborg/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'cyborg', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
253
254
                </div>
              </div>
255
            </div>
Thomas Park's avatar
Thomas Park committed
256
          </div>
Thomas Park's avatar
Thomas Park committed
257

Thomas Park's avatar
Thomas Park committed
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
          <div class="col-lg-4 col-sm-6">
            <div class="preview">
              <div class="image">
                <a href="darkly/"><img class="img-responsive" src="darkly/thumbnail.png" alt="Darkly"></a>
              </div>
              <div class="options">
                <h3>Darkly</h3>
                <p>Flatly in night mode</p>
                <div class="btn-group"><a class="btn btn-info" href="darkly/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="darkly/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'darkly', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="darkly/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'darkly', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="darkly/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'darkly', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="darkly/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'darkly', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="darkly/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'darkly', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
285
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
286
287
288
289
290
291
            <div class="preview">
              <div class="image">
                <a href="flatly/"><img class="img-responsive" src="flatly/thumbnail.png" alt="Flatly"></a>
              </div>
              <div class="options">
                <h3>Flatly</h3>
Thomas Park's avatar
Thomas Park committed
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
                <p>Flat and modern</p>
                <div class="btn-group"><a class="btn btn-info" href="flatly/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="flatly/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="flatly/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="flatly/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="flatly/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="flatly/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'flatly', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
307
308
309
310
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
311
312

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
313
314
315
316
317
318
            <div class="preview">
              <div class="image">
                <a href="journal/"><img class="img-responsive" src="journal/thumbnail.png" alt="Journal"></a>
              </div>
              <div class="options">
                <h3>Journal</h3>
Thomas Park's avatar
Thomas Park committed
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
                <p>Crisp like a new sheet of paper</p>
                <div class="btn-group"><a class="btn btn-info" href="journal/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="journal/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="journal/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="journal/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="journal/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="journal/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'journal', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
334
335
336
337
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
338

Thomas Park's avatar
Thomas Park committed
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
          <div class="col-lg-4 col-sm-6">
            <div class="preview">
              <div class="image">
                <a href="lumen/"><img src="lumen/thumbnail.png" class="img-responsive" alt="Lumen"></a>
              </div>
              <div class="options">
                <h3>Lumen</h3>
                <p>Light and shadow</p>
                <div class="btn-group"><a class="btn btn-info" href="lumen/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="lumen/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="lumen/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="lumen/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="lumen/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="lumen/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'lumen', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>

365
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
366
367
368
369
370
371
            <div class="preview">
              <div class="image">
                <a href="readable/"><img class="img-responsive" src="readable/thumbnail.png" alt="Readable"></a>
              </div>
              <div class="options">
                <h3>Readable</h3>
Thomas Park's avatar
Thomas Park committed
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
                <p>Optimized for legibility</p>
                <div class="btn-group"><a class="btn btn-info" href="readable/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="readable/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="readable/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="readable/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="readable/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="readable/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'readable', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
387
388
389
390
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
391
392

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
393
394
395
396
397
398
            <div class="preview">
              <div class="image">
                <a href="simplex/"><img class="img-responsive" src="simplex/thumbnail.png" alt="Simplex"></a>
              </div>
              <div class="options">
                <h3>Simplex</h3>
Thomas Park's avatar
Thomas Park committed
399
400
401
                <p>Mini and minimalist</p>
                <div class="btn-group"><a class="btn btn-info" href="simplex/">Preview</a></div>
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
402
                  <a class="btn btn-info" target="_blank" href="simplex/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
403
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
404
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
Thomas Park's avatar
Thomas Park committed
405
406
407
408
409
410
411
412
413
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="simplex/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="simplex/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="simplex/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="simplex/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
414
415
416
417
                </div>
              </div>
            </div>
          </div>
418

Thomas Park's avatar
Thomas Park committed
419
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
420
421
422
423
424
425
            <div class="preview">
              <div class="image">
                <a href="slate/"><img class="img-responsive" src="slate/thumbnail.png" alt="Slate"></a>
              </div>
              <div class="options">
                <h3>Slate</h3>
Thomas Park's avatar
Thomas Park committed
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
                <p>Shades of gunmetal gray</p>
                <div class="btn-group"><a class="btn btn-info" href="slate/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="slate/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="slate/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="slate/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="slate/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="slate/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'slate', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
441
442
443
444
445
                </div>

              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
446
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
447
448
449
450
451
452
            <div class="preview">
              <div class="image">
                <a href="spacelab/"><img class="img-responsive" src="spacelab/thumbnail.png" alt="Spacelab"></a>
              </div>
              <div class="options">
                <h3>Spacelab</h3>
Thomas Park's avatar
Thomas Park committed
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
                <p>Silvery and sleek</p>
                <div class="btn-group"><a class="btn btn-info" href="spacelab/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="spacelab/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="spacelab/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="spacelab/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="spacelab/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="spacelab/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'spacelab', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
Thomas Park's avatar
Thomas Park committed
468
469
470
471
                </div>
              </div>
            </div>
          </div>
472

Thomas Park's avatar
Thomas Park committed
473
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
            <div class="preview">
              <div class="image">
                <a href="superhero/"><img class="img-responsive" src="superhero/thumbnail.png" alt="Superhero"></a>
              </div>
              <div class="options">
                <h3>Superhero</h3>
                <p>The brave and the blue</p>
                <div class="btn-group"><a class="btn btn-info" href="superhero/">Preview</a></div>
                <div class="btn-group">
                  <a class="btn btn-info" target="_blank" href="superhero/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootstrap.min.css']);">Download</a>
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                    <li><a target="_blank" href="superhero/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="superhero/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootstrap.css']);">bootstrap.css</a></li>
                    <li class="divider"></li>
                    <li><a target="_blank" href="superhero/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="superhero/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'superhero', 'bootswatch.less']);">bootswatch.less</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
499

Thomas Park's avatar
Thomas Park committed
500
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
501
502
            <div class="preview">
              <div class="image">
Thomas Park's avatar
Thomas Park committed
503
                <a href="united/"><img class="img-responsive" src="united/thumbnail.png" alt="United"></a>
Thomas Park's avatar
Thomas Park committed
504
505
              </div>
              <div class="options">
Thomas Park's avatar
Thomas Park committed
506
507
508
                <h3>United</h3>
                <p>Ubuntu orange and unique font</p>
                <div class="btn-group"><a class="btn btn-info" href="united/">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
509
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
510
511
                  <a class="btn btn-info" target="_blank" href="united/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
512
513
514
515
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
Thomas Park's avatar
Thomas Park committed
516
517
                    <li><a target="_blank" href="united/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="united/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootstrap.css']);">bootstrap.css</a></li>
Thomas Park's avatar
Thomas Park committed
518
                    <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
519
520
                    <li><a target="_blank" href="united/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="united/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'united', 'bootswatch.less']);">bootswatch.less</a></li>
Thomas Park's avatar
Thomas Park committed
521
                  </ul>
Thomas Park's avatar
Thomas Park committed
522
523
524
                </div>
              </div>
            </div>
Thomas Park's avatar
Thomas Park committed
525
          </div>
526

Thomas Park's avatar
Thomas Park committed
527
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
528
529
            <div class="preview">
              <div class="image">
Thomas Park's avatar
Thomas Park committed
530
                <a href="yeti/"><img class="img-responsive" src="yeti/thumbnail.png" alt="Yeti"></a>
Thomas Park's avatar
Thomas Park committed
531
532
              </div>
              <div class="options">
Thomas Park's avatar
Thomas Park committed
533
534
535
                <h3>Yeti</h3>
                <p>A friendly foundation</p>
                <div class="btn-group"><a class="btn btn-info" href="yeti/">Preview</a></div>
Thomas Park's avatar
Thomas Park committed
536
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
537
538
                  <a class="btn btn-info" target="_blank" href="yeti/bootstrap.min.css"
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
539
540
541
542
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
                    <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
Thomas Park's avatar
Thomas Park committed
543
544
                    <li><a target="_blank" href="yeti/bootstrap.min.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootstrap.min.css']);">bootstrap.min.css</a></li>
                    <li><a target="_blank" href="yeti/bootstrap.css" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootstrap.css']);">bootstrap.css</a></li>
Thomas Park's avatar
Thomas Park committed
545
                    <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
546
547
                    <li><a target="_blank" href="yeti/variables.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'variables.less']);">variables.less</a></li>
                    <li><a target="_blank" href="yeti/bootswatch.less" onClick="_gaq.push(['_trackEvent', 'bootswatch', 'yeti', 'bootswatch.less']);">bootswatch.less</a></li>
Thomas Park's avatar
Thomas Park committed
548
                  </ul>
Thomas Park's avatar
Thomas Park committed
549
550
551
552
553
554
555
556
557
558
559
560
                </div>
              </div>
            </div>
          </div>


        </div>
      </div>


      <div class="container">
        <div class="row">
Thomas Park's avatar
Thomas Park committed
561

Thomas Park's avatar
Thomas Park committed
562
563
          <div class="col-lg-12">
            <h1>Want more?</h1>
564
            <p class="lead">Check out these favorites from the paid templates at <a target="_blank" href="https://wrapbootstrap.com/?ref=bsw" title="Marketplace for premium Bootstrap templates" onclick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap']);">WrapBootstrap</a>.</p>
Thomas Park's avatar
Thomas Park committed
565
          </div>
566

Thomas Park's avatar
Thomas Park committed
567
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
568
569
            <div class="preview">
              <div class="image">
570
                <a target="_blank" href="http://wrapbootstrap.com/preview/WB0K176S9?ref=bsw"><img class="img-responsive" src="https://s3.amazonaws.com/wrapbootstrap/live/products/icons/WB0K176S9.jpg" alt="Front Row"></a>
Thomas Park's avatar
Thomas Park committed
571
572
              </div>
              <div class="options">
573
574
575
576
577
                <h3>React</h3>
                <p>A business theme</p>
                <div>
                  <a class="btn btn-info" target="_blank" href="http://wrapbootstrap.com/preview/WB0K176S9?ref=bsw">Preview</a>
                  <a class="btn btn-info" target="_blank" href="https://wrapbootstrap.com/theme/react-business-theme-WB0K176S9?ref=bsw" onClick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap-react']);">Info</a>
Thomas Park's avatar
Thomas Park committed
578
579
580
581
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
582
583

          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
584
585
            <div class="preview">
              <div class="image">
586
                <a target="_blank" href="http://wrapbootstrap.com/preview/WB01649B4?ref=bsw"><img class="img-responsive" src="https://s3.amazonaws.com/wrapbootstrap/live/products/600x375/WB01649B4.png" alt="Clean Canvas"></a>
Thomas Park's avatar
Thomas Park committed
587
588
              </div>
              <div class="options">
589
590
591
592
593
                <h3>Zerif</h3>
                <p>A responsive one-page theme</p>
                <div>
                  <a class="btn btn-info" target="_blank" href="http://wrapbootstrap.com/preview/WB01649B4?ref=bsw">Preview</a>
                  <a class="btn btn-info" target="_blank" href="https://wrapbootstrap.com/theme/zerif-responsive-one-page-theme-WB01649B4?ref=bsw" onClick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap-zerif']);">Info</a>
Thomas Park's avatar
Thomas Park committed
594
595
596
597
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
598
599

          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
600
601
            <div class="preview">
              <div class="image">
602
                <a target="_blank" class="img-responsive" href="http://wrapbootstrap.com/preview/WB09JXK43?ref=bsw"><img class="img-responsive" src="https://s3.amazonaws.com/wrapbootstrap/live/products/600x375/WB09JXK43.png" alt="Clean Canvas"></a>
Thomas Park's avatar
Thomas Park committed
603
604
              </div>
              <div class="options">
605
606
607
608
609
                <h3>Kingboard</h3>
                <p>A responsive admin dashboard</p>
                <div>
                  <a class="btn btn-info" target="_blank" href="http://wrapbootstrap.com/preview/WB09JXK43?ref=bsw">Preview</a>
                  <a class="btn btn-info" target="_blank" href="https://wrapbootstrap.com/theme/kingboard-responsive-admin-dashboard-WB09JXK43?ref=bsw" onClick="_gaq.push(['_trackEvent', 'click', 'outbound', 'wrapbootstrap-kingboard']);">Info</a>
Thomas Park's avatar
Thomas Park committed
610
611
612
613
614
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
615
        </div>
Thomas Park's avatar
Thomas Park committed
616
617
618
619

        <div class="row">
          <div class="col-lg-12">
            <h1>Still looking?</h1>
Thomas Park's avatar
Thomas Park committed
620
            <p class="lead">Learn to code your own themes with these books from <a target="_blank" href="http://www.amazon.com/?tag=bootswatch-20">Amazon</a>.</p>
Thomas Park's avatar
Thomas Park committed
621
          </div>
Thomas Park's avatar
Thomas Park committed
622
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
623
624
            <div class="preview">
              <div class="image">
XhmikosR's avatar
XhmikosR committed
625
                <a onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'htmlandcss']);" href="http://www.amazon.com/gp/product/1118008189/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1118008189" target="_blank"><img class="img-responsive" src="assets/img/refs/htmlandcss.png" alt="HTML and CSS: Design and Build Websites, by Jon Duckett"></a>
Thomas Park's avatar
Thomas Park committed
626
627
628
629
630

              </div>
              <div class="options">
                <h3>HTML &amp; CSS</h3>
                <p>Jon Duckett</p>
Thomas Park's avatar
Thomas Park committed
631
                <div>
XhmikosR's avatar
XhmikosR committed
632
633
                  <img src="http://www.assoc-amazon.com/e/ir?t=bootswatch-20&amp;l=as2&amp;o=1&amp;a=1118008189" width="1" height="1" alt="" style="border:none !important; margin:0px !important; height: 1px;" />
                  <div class="btn-group"><a class="btn btn-info" onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'htmlandcss']);" href="http://www.amazon.com/gp/product/1118008189/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1118008189" target="_blank">Amazon</a></div>
Thomas Park's avatar
Thomas Park committed
634
635
636
637
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
638
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
639
640
            <div class="preview">
              <div class="image">
641

Thomas Park's avatar
Thomas Park committed
642
                <a onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'eloquentjavascript']);" href="http://www.amazon.com/gp/product/1593272820/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1593272820" target="_blank"><img class="img-responsive" src="assets/img/refs/eloquentjavascript.png" alt="Eloquent JavaScript, by Marijn Haverbeke"></a>
Thomas Park's avatar
Thomas Park committed
643
644
645

              </div>
              <div class="options">
646

Thomas Park's avatar
Thomas Park committed
647
648
                <h3>Eloquent JavaScript</h3>
                <p>Marijn Haverbeke</p>
Thomas Park's avatar
Thomas Park committed
649
                <div>
Thomas Park's avatar
Thomas Park committed
650
651
                  <img src="http://www.assoc-amazon.com/e/ir?t=bootswatch-20&amp;l=as2&amp;o=1&amp;a=1593272820" width="1" height="1" alt="" style="border:none !important; margin:0px !important; height: 1px;" />
                  <div class="btn-group"><a class="btn btn-info" onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'lesscss']);" href="http://www.amazon.com/gp/product/1593272820/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1593272820" target="_blank">Amazon</a></div>
Thomas Park's avatar
Thomas Park committed
652
653
654
655
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
656
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
657
658
            <div class="preview">
              <div class="image">
659

XhmikosR's avatar
XhmikosR committed
660
                <a onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'beautifulwebdesign']);" href="http://www.amazon.com/gp/product/098057689X/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=098057689X" target="_blank"><img class="img-responsive" src="assets/img/refs/beautifulwebdesign.png" alt="The Principles of Beautiful Web Design, by Jason Beaird"></a>
Thomas Park's avatar
Thomas Park committed
661
662
663

              </div>
              <div class="options">
664

Thomas Park's avatar
Thomas Park committed
665
666
                <h3>Beautiful Web Design</h3>
                <p>Jason Beaird</p>
Thomas Park's avatar
Thomas Park committed
667
                <div>
XhmikosR's avatar
XhmikosR committed
668
669
                  <img src="http://www.assoc-amazon.com/e/ir?t=bootswatch-20&amp;l=as2&amp;o=1&amp;a=098057689X" width="1" height="1" alt="" style="border:none !important; margin:0px !important; height: 1px;" />
                  <div class="btn-group"><a class="btn btn-info" onClick="_gaq.push(['_trackEvent', 'refs', 'amazon', 'beautifulwebdesign']);" href="http://www.amazon.com/gp/product/098057689X/ref=as_li_tf_tl?ie=UTF8&amp;tag=bootswatch-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=098057689X" target="_blank">Amazon</a></div>
Thomas Park's avatar
Thomas Park committed
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
                </div>
              </div>
            </div>
          </div>
        </div>



      </div>
    </div>

    <div class="container">
      <footer>
        <div class="row">
          <div class="col-lg-12">
685

Thomas Park's avatar
Thomas Park committed
686
687
688
689
690
691
            <ul class="list-unstyled">
              <li class="pull-right"><a href="#top">Back to top</a></li>
              <li><a href="http://news.bootswatch.com" onclick="pageTracker._link(this.href); return false;">Blog</a></li>
              <li><a href="http://feeds.feedburner.com/bootswatch">RSS</a></li>
              <li><a href="https://twitter.com/thomashpark">Twitter</a></li>
              <li><a href="https://github.com/thomaspark/bootswatch/">GitHub</a></li>
692
              <li><a href="./help/#api">API</a></li>
Thomas Park's avatar
Thomas Park committed
693
694
              <li><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=F22JEM3Q78JC2">Donate</a></li>
            </ul>
Thomas Park's avatar
Thomas Park committed
695
            <p>Made by <a href="http://thomaspark.me" rel="nofollow">Thomas Park</a>. Contact him at <a href="mailto:thomas@bootswatch.com">thomas@bootswatch.com</a>.</p>
Thomas Park's avatar
Thomas Park committed
696
            <p>Code released under the <a href="https://github.com/thomaspark/bootswatch/blob/gh-pages/LICENSE">MIT License</a>.</p>
Thomas Park's avatar
Thomas Park committed
697
            <p>Based on <a href="http://getbootstrap.com" rel="nofollow">Bootstrap</a>. Icons from <a href="http://fortawesome.github.io/Font-Awesome/" rel="nofollow">Font Awesome</a>. Web fonts from <a href="http://www.google.com/webfonts" rel="nofollow">Google</a>.</p>
Thomas Park's avatar
Thomas Park committed
698
699
700

          </div>
        </div>
701

Thomas Park's avatar
Thomas Park committed
702
      </footer>
703

Thomas Park's avatar
Thomas Park committed
704
705
706
707

    </div>


708
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
Thomas Park's avatar
Thomas Park committed
709
710
    <script src="./bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="./assets/js/bootswatch.js"></script>
XhmikosR's avatar
XhmikosR committed
711
    <script>
Thomas Park's avatar
Thomas Park committed
712
713
714
      !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
    </script>
  </body>
Graham Campbell's avatar
Tweaks    
Graham Campbell committed
715
</html>