index.html 42.8 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
103
104
105
106
107
108
109
110
111
112
                <div class="sponsor" style="min-height: 300px;">
                  <div id="md-large-widget"></div>
                  <script type="text/javascript">
                  (function() {
                    var url = 'http://www.mightydeals.com/widgets/large/image_only/yes/ref/bootswatch';
                    var s = document.createElement('script'), s1 = document.getElementsByTagName('script')[0];
                    s.type = 'text/javascript';
                    s.async = true;
                    s.src = url;
                    s1.parentNode.insertBefore(s, s1);
                  })();
                  </script>
Thomas Park's avatar
Thomas Park committed
113
                </div>
Thomas Park's avatar
Thomas Park committed
114
              </div>
Thomas Park's avatar
Thomas Park committed
115
            </div>
Thomas Park's avatar
Thomas Park committed
116
          </div>
Thomas Park's avatar
Thomas Park committed
117
118
119
120
121
122
123
124
125
        </div>

      </div>
    </div>

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

        <div class="row">
Thomas Park's avatar
Thomas Park committed
126
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
127
            <h3><i class="fa fa-file-o"></i> Easy to Install</h3>
Thomas Park's avatar
Thomas Park committed
128
129
            <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
130
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
131
            <h3><i class="fa fa-github"></i> Open Source</h3>
Thomas Park's avatar
Thomas Park committed
132
            <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
133
          </div>
Thomas Park's avatar
Thomas Park committed
134
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
135
            <h3><i class="fa fa-wrench"></i> Tuned for 3.2.0</h3>
136
            <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
137
          </div>
Thomas Park's avatar
Thomas Park committed
138
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
139
            <h3><i class="fa fa-cogs"></i> Modular</h3>
Thomas Park's avatar
Thomas Park committed
140
141
             <p>Changes are contained in just two LESS files, enabling modification and ensuring forward compatibility.</p>
          </div>
Thomas Park's avatar
Thomas Park committed
142
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
143
            <h3><i class="fa fa-cloud"></i> Get Plugged In</h3>
Thomas Park's avatar
Thomas Park committed
144
            <p>An <a href="./help/#api" onclick="pageTracker._link(this.href); return false;">API</a> is available for integrating with your platform. In use by <a href="http://320press.com/wpbs/" target="_blank">WPBS</a>, <a href="http://www.fusionleaf.com/" target="_blank">FusionLeaf</a>, <a href="http://yabdab.com/stacks/snaps/bootsnap/" target="_blank">BootSnap</a>, and others.</p>
Thomas Park's avatar
Thomas Park committed
145
          </div>
Thomas Park's avatar
Thomas Park committed
146
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
147
            <h3><i class="fa fa-bullhorn"></i> Stay Updated</h3>
XhmikosR's avatar
XhmikosR committed
148
            <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
149
150
          </div>
        </div>
Thomas Park's avatar
Thomas Park committed
151

Thomas Park's avatar
Thomas Park committed
152
153
154
155
156
157
158
      </div>
    </div>

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

Thomas Park's avatar
Thomas Park committed
159
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
160
161
162
163
164
165
166
            <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
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
                <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
184
185
186
187
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
188
189

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
190
191
192
193
194
195
            <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
196
                <p>A calm blue sky</p>
Thomas Park's avatar
Thomas Park committed
197
198
199
200
201
202
203
204
205
206
207
208
209
                <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
210
211
212
213
214
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
215
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
216
217
218
219
220
221
            <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
222
223
224
225
226
227
228
229
230
231
232
233
234
235
                <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
236
237
238
239
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
240

241
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
242
243
244
245
246
247
            <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
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
                <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
263
264
                </div>
              </div>
265
            </div>
Thomas Park's avatar
Thomas Park committed
266
          </div>
Thomas Park's avatar
Thomas Park committed
267

Thomas Park's avatar
Thomas Park committed
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
          <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
295
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
296
297
298
299
300
301
            <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
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
                <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
317
318
319
320
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
321
322

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
323
324
325
326
327
328
            <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
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
                <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
344
345
346
347
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
348

Thomas Park's avatar
Thomas Park committed
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
          <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>

375
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
376
377
378
379
380
381
            <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
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
                <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
397
398
399
400
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
401
402

          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
403
404
405
406
407
408
            <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
409
410
411
                <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
412
                  <a class="btn btn-info" target="_blank" href="simplex/bootstrap.min.css"
Thomas Park's avatar
Thomas Park committed
413
                  onClick="_gaq.push(['_trackEvent', 'bootswatch', 'simplex', 'bootstrap.min.css']);">Download</a>
Thomas Park's avatar
Thomas Park committed
414
                  <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
Thomas Park's avatar
Thomas Park committed
415
416
417
418
419
420
421
422
423
                    <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
424
425
426
427
                </div>
              </div>
            </div>
          </div>
428

Thomas Park's avatar
Thomas Park committed
429
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
430
431
432
433
434
435
            <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
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
                <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
451
452
453
454
455
                </div>

              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
456
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
457
458
459
460
461
462
            <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
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
                <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
478
479
480
481
                </div>
              </div>
            </div>
          </div>
482

Thomas Park's avatar
Thomas Park committed
483
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
            <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>
509

Thomas Park's avatar
Thomas Park committed
510
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
511
512
            <div class="preview">
              <div class="image">
Thomas Park's avatar
Thomas Park committed
513
                <a href="united/"><img class="img-responsive" src="united/thumbnail.png" alt="United"></a>
Thomas Park's avatar
Thomas Park committed
514
515
              </div>
              <div class="options">
Thomas Park's avatar
Thomas Park committed
516
517
518
                <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
519
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
520
521
                  <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
522
523
524
525
                  <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
526
527
                    <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
528
                    <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
529
530
                    <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
531
                  </ul>
Thomas Park's avatar
Thomas Park committed
532
533
534
                </div>
              </div>
            </div>
Thomas Park's avatar
Thomas Park committed
535
          </div>
536

Thomas Park's avatar
Thomas Park committed
537
          <div class="col-lg-4 col-sm-6">
Thomas Park's avatar
Thomas Park committed
538
539
            <div class="preview">
              <div class="image">
Thomas Park's avatar
Thomas Park committed
540
                <a href="yeti/"><img class="img-responsive" src="yeti/thumbnail.png" alt="Yeti"></a>
Thomas Park's avatar
Thomas Park committed
541
542
              </div>
              <div class="options">
Thomas Park's avatar
Thomas Park committed
543
544
545
                <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
546
                <div class="btn-group">
Thomas Park's avatar
Thomas Park committed
547
548
                  <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
549
550
551
552
                  <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
553
554
                    <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
555
                    <li class="divider"></li>
Thomas Park's avatar
Thomas Park committed
556
557
                    <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
558
                  </ul>
Thomas Park's avatar
Thomas Park committed
559
560
561
562
563
564
565
566
567
568
569
570
                </div>
              </div>
            </div>
          </div>


        </div>
      </div>


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

Thomas Park's avatar
Thomas Park committed
572
573
          <div class="col-lg-12">
            <h1>Want more?</h1>
574
            <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
575
          </div>
576

Thomas Park's avatar
Thomas Park committed
577
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
578
579
            <div class="preview">
              <div class="image">
580
                <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
581
582
              </div>
              <div class="options">
583
584
585
586
587
                <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
588
589
590
591
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
592
593

          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
594
595
            <div class="preview">
              <div class="image">
596
                <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
597
598
              </div>
              <div class="options">
599
600
601
602
603
                <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
604
605
606
607
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
608
609

          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
610
611
            <div class="preview">
              <div class="image">
612
                <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
613
614
              </div>
              <div class="options">
615
616
617
618
619
                <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
620
621
622
623
624
                </div>
              </div>
            </div>
          </div>

Thomas Park's avatar
Thomas Park committed
625
        </div>
Thomas Park's avatar
Thomas Park committed
626
627
628
629

        <div class="row">
          <div class="col-lg-12">
            <h1>Still looking?</h1>
Thomas Park's avatar
Thomas Park committed
630
            <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
631
          </div>
Thomas Park's avatar
Thomas Park committed
632
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
633
634
            <div class="preview">
              <div class="image">
XhmikosR's avatar
XhmikosR committed
635
                <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
636
637
638
639
640

              </div>
              <div class="options">
                <h3>HTML &amp; CSS</h3>
                <p>Jon Duckett</p>
Thomas Park's avatar
Thomas Park committed
641
                <div>
XhmikosR's avatar
XhmikosR committed
642
643
                  <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
644
645
646
647
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
648
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
649
650
            <div class="preview">
              <div class="image">
651

Thomas Park's avatar
Thomas Park committed
652
                <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
653
654
655

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

Thomas Park's avatar
Thomas Park committed
657
658
                <h3>Eloquent JavaScript</h3>
                <p>Marijn Haverbeke</p>
Thomas Park's avatar
Thomas Park committed
659
                <div>
Thomas Park's avatar
Thomas Park committed
660
661
                  <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
662
663
664
665
                </div>
              </div>
            </div>
          </div>
Thomas Park's avatar
Thomas Park committed
666
          <div class="col-lg-4 col-sm-4">
Thomas Park's avatar
Thomas Park committed
667
668
            <div class="preview">
              <div class="image">
669

XhmikosR's avatar
XhmikosR committed
670
                <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
671
672
673

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

Thomas Park's avatar
Thomas Park committed
675
676
                <h3>Beautiful Web Design</h3>
                <p>Jason Beaird</p>
Thomas Park's avatar
Thomas Park committed
677
                <div>
XhmikosR's avatar
XhmikosR committed
678
679
                  <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
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
                </div>
              </div>
            </div>
          </div>
        </div>



      </div>
    </div>

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

Thomas Park's avatar
Thomas Park committed
696
697
698
699
700
701
            <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>
702
              <li><a href="./help/#api">API</a></li>
Thomas Park's avatar
Thomas Park committed
703
704
              <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
705
            <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
706
            <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
707
            <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
708
709
710

          </div>
        </div>
711

Thomas Park's avatar
Thomas Park committed
712
      </footer>
713

Thomas Park's avatar
Thomas Park committed
714
715
716
717

    </div>


718
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
Thomas Park's avatar
Thomas Park committed
719
720
    <script src="./bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="./assets/js/bootswatch.js"></script>
XhmikosR's avatar
XhmikosR committed
721
    <script>
Thomas Park's avatar
Thomas Park committed
722
723
724
      !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
725
</html>