• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1fullpage=true
2page.title=Design
3page.viewport_width=970
4section.landing=true
5meta.tags="beautifulapps, design, ux, patterns, holo, appquality, landing"
6header.hide=1
7footer.hide=1
8@jd:body
9
10<section class="dac-expand dac-hero dac-light">
11  <div class="wrap">
12    <div class="cols dac-hero-content">
13      <div class="col-1of2 col-push-1of2 dac-hero-figure">
14        <img class="dac-hero-image" src="/design/media/hero-material-design.png">
15      </div>
16      <div class="col-1of2 col-pull-1of2">
17        <h1 class="dac-hero-title">Up and running with material design</h1>
18        <p class="dac-hero-description">
19        Android uses a new design metaphor inspired by paper and ink that provides a reassuring
20        sense of tactility. Visit the <a href="https://www.google.com/design/spec/material-design/introduction.html">material design</a> site for more resources.
21        </p>
22        <a class="dac-hero-cta" href="https://www.google.com/design/spec/material-design/introduction.html">
23          <span class="dac-sprite dac-auto-chevron"></span>
24          Introducing material design
25        </a><br>
26        <a class="dac-hero-cta" href="https://www.google.com/design/spec/resources/color-palettes.html">
27          <span class="dac-sprite dac-auto-chevron"></span>
28          Downloads for designers
29        </a><br>
30        <a class="dac-hero-cta" href="https://google.com/design/articles/">
31          <span class="dac-sprite dac-auto-chevron"></span>
32          Articles
33        </a>
34      </div>
35    </div>
36    <div class="dac-section dac-small">
37      <div class="resource-widget resource-flow-layout col-16"
38           data-query="collection:design/landing/materialdesign"
39           data-cardSizes="6x2"
40           data-maxResults="6"></div>
41    </div>
42  </div>
43</section>
44<div class="wrap dac-offset-parent">
45  <a class="dac-fab dac-scroll-button" data-scroll-button href="#latest">
46    <i class="dac-sprite dac-arrow-down-gray"></i>
47  </a>
48</div>
49<section class="dac-section dac-gray dac-small dac-invert" id="latest"><div class="wrap">
50  <h2 class="norule">Latest</h2>
51  <div class="resource-widget resource-flow-layout col-16"
52       data-query="collection:design/landing/latest"
53       data-cardSizes="6x6"
54       data-maxResults="3"></div>
55</div></section>
56
57<section class="dac-section dac-light"><div class="wrap">
58  <h1 class="dac-section-title">Pure Android</h1>
59  <div class="dac-section-subtitle">
60    Design around Android's capabilities and conventions to give users the best experience.
61  </div>
62  <div class="resource-widget resource-flow-layout col-16"
63       data-query="collection:design/landing/pureandroid"
64       data-cardSizes="6x6"
65       data-maxResults="6"></div>
66</div></section>
67
68<section class="dac-section dac-gray"><div class="wrap">
69  <h1 class="dac-section-title">Resources</h1>
70  <div class="dac-section-subtitle">
71    Essential downloads, stencils, and tools to help you create your design.
72  </div>
73  <div class="resource-widget resource-flow-layout col-16"
74       data-query="collection:design/landing/resources"
75       data-cardSizes="6x2"
76       data-maxResults="6"></div>
77</div></section>
78