1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1"> 6 <meta name="csrf-token" content="FppeJJ3euEjugSEHu0350IA2FvPnw3v27tLCEyIR"> 7 <meta name="theme-color" content="#1A1A1A"> 8 9 <link rel="icon" type="image/x-icon" href="https://drawgestures.com/favicon.ico"> 10 <link rel="icon" type="image/png" sizes="32x32" href="https://drawgestures.com/favicon-32x32.png"> 11 <link rel="icon" type="image/png" sizes="16x16" href="https://drawgestures.com/favicon-16x16.png"> 12 <link rel="apple-touch-icon" sizes="180x180" href="https://drawgestures.com/apple-touch-icon.png"> 13 14 <title>Gesture Drawing App & Timer â Free Online Practice | DrawGestures</title> 15<meta name="description" content="Practise gesture drawing online with a free drawing timer (30 seconds to 10 minutes), curated reference poses and tablet-friendly tools. Web, iOS, Android and desktop. No sign-up."> 16<meta name="keywords" content="gesture drawing, gesture drawing app, gesture drawing app free, gesture drawing website, gesture drawing online, drawing timer, gesture drawing timer, figure drawing timer, gesture drawing practice, pose reference app, pinterest gesture drawing"> 17<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1"> 18 19<link rel="canonical" href="https://drawgestures.com/"> 20 21<meta property="og:type" content="website"> 22<meta property="og:url" content="https://drawgestures.com/"> 23<meta property="og:title" content="Gesture Drawing App & Timer â Free Online Practice | DrawGestures"> 24<meta property="og:description" content="Practise gesture drawing online with a free drawing timer (30 seconds to 10 minutes), curated reference poses and tablet-friendly tools. Web, iOS, Android and desktop. No sign-up."> 25<meta property="og:image" content="https://drawgestures.com/og-image.jpg"> 26<meta property="og:image:alt" content="DrawGestures â free online gesture & figure drawing practice tool"> 27<meta property="og:site_name" content="DrawGestures: Figure Drawing"> 28<meta property="og:locale" content="en_US"> 29<meta property="fb:app_id" content="335569033855798"> 30 31<meta name="twitter:card" content="summary_large_image"> 32<meta name="twitter:url" content="https://drawgestures.com/"> 33<meta name="twitter:title" content="Gesture Drawing App & Timer â Free Online Practice | DrawGestures"> 34<meta name="twitter:description" content="Practise gesture drawing online with a free drawing timer (30 seconds to 10 minutes), curated reference poses and tablet-friendly tools. Web, iOS, Android and desktop. No sign-up."> 35<meta name="twitter:image" content="https://drawgestures.com/og-image.jpg"> 36<meta name="twitter:image:alt" content="DrawGestures â free online gesture & figure drawing practice tool"> 37
38<script type="application/ld+json"> 39{ 40 "@context": "https://schema.org", 41 "@graph": [ 42 { 43 "@type": "Organization", 44 "@id": "https://drawgestures.com/#organization", 45 "name": "DrawGestures", 46 "url": "https://drawgestures.com/", 47 "logo": "https://drawgestures.com/images/logo.png", 48 "sameAs": [ 49 "https://www.instagram.com/drawgestures/", 50 "https://x.com/drawgestures", 51 "https://apps.apple.com/us/app/draw-gestures-figure-drawing/id1552057070", 52 "https://play.google.com/store/apps/details?id=com.darkmat13r.gesturedrawing" 53 ] 54 }, 55 { 56 "@type": "WebSite", 57 "@id": "https://drawgestures.com/#website", 58 "name": "DrawGestures", 59 "url": "https://drawgestures.com/", 60 "publisher": { 61 "@id": "https://drawgestures.com/#organization" 62 }, 63 "inLanguage": "en-US" 64 }, 65 { 66 "@type": "SoftwareApplication", 67 "@id": "https://drawgestures.com/#app", 68 "name": "DrawGestures â Gesture Drawing App & Timer", 69 "description": "Free gesture drawing app with a built-in drawing timer, curated reference poses and tablet-friendly drawing tools. Practise gesture drawing online or on iOS, Android, Windows and macOS.", 70 "url": "https://drawgestures.com/", 71 "applicationCategory": "DesignApplication", 72 "operatingSystem": "Web, iOS, Android, Windows, macOS", 73 "installUrl": "https://drawgestures.com/download", 74 "screenshot": "https://drawgestures.com/images/app_home_page.png", 75 "featureList": "Gesture drawing timer (30s, 1m, 2m, 5m, 10m), auto-advance and shuffle, curated reference poses, Pinterest and Google image libraries, draw on top of references, tablet and pen support", 76 "offers": { 77 "@type": "Offer", 78 "price": "0", 79 "priceCurrency": "USD" 80 }, 81 "publisher": { 82 "@id": "https://drawgestures.com/#organization" 83 } 84 }, 85 { 86 "@type": "FAQPage", 87 "@id": "https://drawgestures.com/#faq", 88 "mainEntity": [ 89 { 90 "@type": "Question", 91 "name": "What is gesture drawing?", 92 "acceptedAnswer": { 93 "@type": "Answer", 94 "text": "Gesture drawing is a quick sketch, usually 30 seconds to 2 minutes, that captures the movement, energy and rhythm of a pose rather than its details. Artists and animators use it as a daily warm-up and as the foundation of figure drawing." 95 } 96 }, 97 { 98 "@type": "Question", 99 "name": "Is DrawGestures a free gesture drawing app?", 100 "acceptedAnswer": { 101 "@type": "Answer", 102 "text": "Yes. The drawing timer, timed sessions and curated reference poses are free on the web, iOS and Android, with no sign-up and no ads. Pro, from $2.99 a month, adds Pinterest and cloud imports, custom intervals and extra session modes." 103 } 104 }, 105 { 106 "@type": "Question", 107 "name": "Can I practise gesture drawing online in my browser?", 108 "acceptedAnswer": { 109 "@type": "Answer", 110 "text": "Yes. Open the DrawGestures web app, pick a reference library, set the drawing timer and start drawing. Nothing to install. The same sessions are available in the iOS, Android and desktop apps." 111 } 112 }, 113 { 114 "@type": "Question", 115 "name": "What timer intervals should I use for gesture drawing?", 116 "acceptedAnswer": { 117 "@type": "Answer", 118 "text": "Start with ten 30-second poses to warm up, then move to 1 or 2 minutes for the bulk of the session. Anything from 5 minutes up is closer to figure drawing than gesture drawing." 119 } 120 }, 121 { 122 "@type": "Question", 123 "name": "Does the gesture drawing timer advance automatically?",
124 "acceptedAnswer": { 125 "@type": "Answer", 126 "text": "Yes. When the interval ends the next reference image appears on its own, so you never stop to click. Turn on shuffle to see poses in random order." 127 } 128 }, 129 { 130 "@type": "Question", 131 "name": "Which devices does DrawGestures work on?", 132 "acceptedAnswer": { 133 "@type": "Answer", 134 "text": "Any modern browser, iPhone and iPad, Android phones and tablets, Windows and macOS. The app is built for tablets, with pen input and drawing on top of the reference." 135 } 136 } 137 ] 138 } 139 ] 140} 141</script>
141 142 143<meta name="dg:page-name" content="home"> 144<meta name="dg:page-type" content="home"> 145 146 147 <link rel="preconnect" href="https://fonts.googleapis.com"> 148 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 149 <link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;500;700&family=Kanit:wght@300;400;500;700&display=swap" rel="stylesheet"> 150 151 152 <link href="https://drawgestures.com/css/design-system.css" rel="stylesheet"> 153 <link href="https://drawgestures.com/css/ds-web.css" rel="stylesheet"> 154 155 <style> 156 /* ---- Home page "B Bold" (scoped: .dg-*) ---- */ 157 [id] { scroll-margin-top: calc(var(--ds-topbar-height) + var(--space-md)); } 158 159 @keyframes dgHeroIn { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } 160 @keyframes dgMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } 161 162 /* Pill buttons on this page */ 163 .dg-cta-row .ds-btn, 164 .dg-guides__all .ds-btn { border-radius: var(--radius-full); } 165 166 /* Section rhythm + centered headers */ 167 .dg-sec { padding-top: 6rem; padding-bottom: 6rem; } 168 .dg-section-head { 169 max-width: 44rem; 170 margin: 0 auto; 171 text-align: center; 172 } 173 .dg-eyebrow { 174 font-family: var(--font-plain); 175 font-size: var(--text-label-small); 176 font-weight: 500; 177 letter-spacing: 0.18em; 178 text-transform: uppercase; 179 color: var(--color-primary); 180 } 181 .dg-section-head .ds-heading { 182 margin-top: var(--space-md); 183 font-size: clamp(1.875rem, 3.4vw + 0.5rem, 2.75rem); 184 line-height: 1.12; 185 letter-spacing: -0.02em; 186 text-wrap: balance; 187 } 188 .dg-section-head > .ds-text { 189 margin-top: var(--space-md); 190 font-weight: 300; 191 text-wrap: pretty; 192 } 193 .dg-strong { color: var(--color-neutral-white); font-weight: 500; } 194 195 /* Hero â centered */ 196 .dg-hero { 197 position: relative; 198 padding: 6rem 0 0; 199 text-align: center; 200 overflow-x: clip; 201 } 202 .dg-hero__glow { 203 position: absolute; 204 top: -12.5rem; 205 left: 50%; 206 transform: translateX(-50%); 207 width: 56rem; 208 height: 37.5rem; 209 border-radius: var(--radius-full); 210 background: radial-gradient(ellipse, color-mix(in srgb, var(--color-primary) 13%, transparent) 0%, transparent 65%); 211 pointer-events: none; 212 } 213 .dg-hero__copy { 214 position: relative; 215 max-width: 55rem; 216 margin: 0 auto; 217 padding: 0 var(--space-lg); 218 display: flex; 219 flex-direction: column; 220 align-items: center; 221 } 222 .dg-hero .ds-heading--display { 223 margin-top: 1.75rem; 224 font-size: clamp(2.75rem, 6.5vw + 0.5rem, 4.75rem); 225 line-height: 1.04; 226 letter-spacing: -0.025em; 227 text-wrap: balance; 228 } 229 .dg-hero__lede { 230 margin-top: 1.625rem; 231 max-width: 36rem; 232 font-weight: 300; 233 text-wrap: pretty; 234 } 235 .dg-hero__lede strong { color: var(--color-neutral-white); font-weight: 500; } 236 .dg-cta-row { 237 display: flex; 238 flex-wrap: wrap; 239 align-items: center; 240 justify-content: center; 241 gap: var(--space-normal); 242 margin-top: 2.25rem; 243 } 244 .dg-platforms { 245 display: flex; 246 flex-wrap: wrap; 247 justify-content: center; 248 gap: var(--space-sm); 249 margin-top: 1.25rem; 250 } 251 .dg-platform { 252 display: inline-flex; 253 align-items: center; 254 gap: var(--space-sm); 255 height: 2.5rem; 256 padding: 0 var(--space-md); 257 border-radius: var(--radius-full); 258 background: color-mix(in srgb, var(--color-neutral-white) 3%, transparent); 259 border: var(--border-thin) solid var(--ds-glass-border); 260 color: var(--color-neutral-silver); 261 text-decoration: none; 262 font-family: var(--font-plain); 263 font-size: var(--text-body-small); 264 transition: all 200ms cubic-bezier(0.2, 0, 0, 1); 265 } 266 .dg-platform:hover { 267 background: var(--ds-glass-hover); 268 border-color: color-mix(in srgb, var(--color-neutral-white) 22%, transparent); 269 color: var(--color-neutral-white); 270 } 271 .dg-rating { 272 display: flex; 273 flex-wrap: wrap; 274 justify-content: center; 275 align-items: center; 276 gap: var(--space-sm) var(--space-md); 277 margin-top: 1.375rem; 278 font-family: var(--font-plain); 279 font-size: var(--text-body-small); 280 color: var(--color-neutral-ash); 281 } 282 .dg-stars { 283 color: var(--color-premium-gold); 284 letter-spacing: 0.12em; 285 white-space: nowrap; 286 } 287 .dg-stars--dim { color: var(--color-charcoal-light); } 288 .dg-rating__sep { color: var(--color-charcoal-light); } 289 290 /* Phone centerpiece */ 291 .dg-hero__stage { 292 position: relative; 293 max-width: 72.5rem; 294 margin: 4rem auto 0; 295 padding: 0 var(--space-lg); 296 display: flex; 297 justify-content: center; 298 } 299 .dg-phone { 300 width: min(21.25rem, 82vw); 301 padding: 0.875rem 0.875rem 0; 302 background: var(--ds-glass-elevated); 303 border: var(--border-thin) solid var(--ds-glass-border); 304 border-bottom: none; 305 border-radius: 2rem 2rem 0 0; 306 box-shadow: 0 -16px 48px rgba(0, 0, 0, 0.45), inset 0 1px 0 color-mix(in srgb, var(--color-neutral-white) 8%, transparent); 307 } 308 .dg-phone img { 309 display: block; 310 width: 100%; 311 border-radius: 1.25rem 1.25rem 0 0; 312 } 313 .dg-hero__rule { height: 1px; background: var(--ds-glass-border); } 314 315 /* Hero entrance (motion-safe only) */ 316 @media (prefers-reduced-motion: no-preference) { 317 .dg-anim { animation: dgHeroIn 0.7s cubic-bezier(0, 0, 0, 1) both; } 318 .dg-anim--d1 { animation-delay: 0.08s; } 319 .dg-anim--d2 { animation-delay: 0.16s; } 320 .dg-anim--d3 { animation-delay: 0.24s; } 321 .dg-anim--d3b { animation-delay: 0.3s; } 322 .dg-anim--d4 { animation-delay: 0.32s; } 323 .dg-anim--d5 { animation-delay: 0.4s; animation-duration: 0.9s; } 324 } 325 326 /* Scroll reveal (enabled by JS, motion-safe only) */ 327 @media (prefers-reduced-motion: no-preference) { 328 .dg-js [data-reveal] { opacity: 0; transform: translateY(26px); } 329 .dg-js [data-reveal].is-in { 330 opacity: 1; 331 transform: translateY(0); 332 transition: opacity 0.75s cubic-bezier(0, 0, 0, 1) var(--reveal-delay, 0ms), 333 transform 0.75s cubic-bezier(0, 0, 0, 1) var(--reveal-delay, 0ms); 334 } 335 } 336
337 /* About â copy + card-free fact strip */ 338 .dg-about__copy .ds-text { font-weight: 300; text-wrap: pretty; } 339 .dg-about__copy .ds-text + .ds-text { margin-top: 0.875rem; } 340 .dg-facts { 341 margin-top: 4rem; 342 border-top: var(--border-thin) solid var(--ds-glass-border); 343 border-bottom: var(--border-thin) solid var(--ds-glass-border); 344 display: grid; 345 grid-template-columns: repeat(auto-fit, minmax(min(13.75rem, 100%), 1fr)); 346 } 347 .dg-facts > div { 348 padding: 1.75rem var(--space-lg); 349 border-right: var(--border-thin) solid color-mix(in srgb, var(--color-neutral-white) 8%, transparent); 350 } 351 .dg-facts > div:last-child { border-right: none; } 352 .dg-facts__label { 353 margin: 0 0 var(--space-xs); 354 font-family: var(--font-plain); 355 font-size: var(--text-label-small); 356 font-weight: 500; 357 text-transform: uppercase; 358 letter-spacing: 0.14em; 359 color: var(--color-primary); 360 } 361 .dg-facts__value { 362 margin: 0; 363 font-family: var(--font-plain); 364 font-size: var(--text-body-medium); 365 line-height: 1.5; 366 color: var(--color-on-surface); 367 } 368 369 /* Google-data editorial footnote */ 370 .dg-gdata { 371 max-width: 51.25rem; 372 margin: 3.5rem auto 0; 373 text-align: center; 374 } 375 .dg-gdata > .ds-heading { font-size: var(--ds-text-lg); } 376 .dg-gdata__intro { margin: var(--space-xs) 0 1.75rem; } 377 .dg-gdata__grid { 378 display: grid; 379 grid-template-columns: repeat(auto-fit, minmax(min(13.75rem, 100%), 1fr)); 380 gap: var(--space-lg) 2rem; 381 text-align: left; 382 } 383 .dg-gdata__item { display: flex; gap: 0.875rem; } 384 .dg-gdata__ix { 385 flex-shrink: 0; 386 font-family: var(--font-brand); 387 font-weight: 700; 388 font-size: var(--text-body-medium); 389 color: var(--color-primary); 390 } 391 .dg-gdata__item em { font-style: normal; font-weight: 500; color: var(--color-neutral-white); } 392 .dg-gdata__legal { margin-top: 1.75rem; } 393 .dg-gdata__legal a { 394 color: var(--color-primary); 395 text-decoration: underline; 396 text-underline-offset: 3px; 397 } 398 399 /* Features â card-free editorial grid */ 400 .dg-features { 401 display: grid; 402 grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr)); 403 gap: 3.5rem 2.5rem; 404 margin-top: 4rem; 405 } 406 .dg-feature { display: flex; flex-direction: column; } 407 .dg-feature__illo { 408 position: relative; 409 height: 12.5rem; 410 border-radius: var(--radius-card); 411 overflow: hidden; 412 background: var(--ds-glass-surface); 413 } 414 .dg-feature__illo img { display: block; width: 100%; height: 100%; object-fit: cover; } 415 /* Source-backed libraries: the brand mark sits over a backdrop that hints at 416 the source's own UI, on the same dark tone as the app screenshots. */ 417 .dg-feature__illo--logo { 418 display: grid; 419 place-items: center; 420 background: var(--color-charcoal-black); 421 isolation: isolate; 422 } 423 .dg-feature__illo--logo::after { 424 content: ""; 425 position: absolute; 426 inset: 0; 427 z-index: 1; 428 background: radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--color-charcoal-black) 70%, transparent) 0, transparent 9rem); 429 pointer-events: none; 430 } 431 .dg-feature__mark { 432 position: relative; 433 z-index: 2; 434 display: grid; 435 place-items: center; 436 width: 5.5rem; 437 height: 5.5rem; 438 border-radius: 50%; 439 background: var(--color-neutral-white); 440 box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45); 441 } 442 .dg-feature__mark svg { display: block; } 443 /* Optical balance: the Drive mark is a wide triangle, the Pinterest mark a full disc */ 444 .dg-feature__mark .sk-icon--google-drive { width: 3.5rem; height: 3.5rem; transform: translateY(2px); } 445 446 /* Pinterest: staggered masonry board of pastel placeholders, mid-load */ 447 .dg-pins { 448 position: absolute; 449 inset: -0.5rem 0.5rem auto; 450 display: flex; 451 gap: 0.5rem; 452 } 453 .dg-pins__col { 454 flex: 1; 455 display: flex; 456 flex-direction: column; 457 gap: 0.5rem; 458 transform: translateY(calc(var(--offset) * -1)); 459 } 460 .dg-pins__cell { 461 position: relative; 462 height: var(--h); 463 border-radius: 0.75rem; 464 overflow: hidden; 465 background: hsl(var(--hue) 32% 76%); 466 opacity: 0.68; 467 } 468 469 /* Google Drive: folder grid in Drive's dark-mode style */ 470 .dg-drive { 471 position: absolute; 472 inset: 0.875rem; 473 display: grid; 474 grid-template-columns: repeat(3, 1fr); 475 align-content: center; 476 gap: 0.625rem; 477 } 478 .dg-drive__folder { 479 position: relative; 480 display: flex; 481 align-items: center; 482 gap: 0.5rem; 483 height: 2.5rem; 484 padding: 0 0.75rem; 485 border-radius: 0.75rem; 486 overflow: hidden; 487 background: color-mix(in srgb, var(--color-neutral-white) 7%, transparent); 488 } 489 .dg-drive__icon { 490 flex-shrink: 0; 491 width: 1.125rem; 492 height: 1.125rem; 493 fill: hsl(var(--hue) 35% 62%); 494 } 495 .dg-drive__icon.is-grey { fill: color-mix(in srgb, var(--color-neutral-white) 45%, transparent); } 496 .dg-drive__name { 497 width: var(--w); 498 height: 0.4375rem; 499 border-radius: 999px; 500 background: color-mix(in srgb, var(--color-neutral-white) 22%, transparent); 501 } 502 503 /* Loading shimmer across both backdrops */ 504 .dg-pins__cell::after, 505 .dg-drive__folder::after { 506 content: ""; 507 position: absolute; 508 inset: 0; 509 background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, 0.28) 50%, transparent 70%); 510 transform: translateX(-100%); 511 } 512 @media (prefers-reduced-motion: no-preference) { 513 .dg-pins__cell::after, 514 .dg-drive__folder::after { animation: dg-shimmer 2.4s ease-in-out var(--d, 0ms) infinite; } 515 }
516 @keyframes dg-shimmer { 517 0% { transform: translateX(-100%); } 518 60%, 100% { transform: translateX(100%); } 519 } 520 .dg-feature__head { 521 display: flex; 522 align-items: baseline; 523 gap: var(--space-normal); 524 margin-top: 1.25rem; 525 } 526 .dg-feature__num { 527 font-family: var(--font-brand); 528 font-weight: 700; 529 font-size: var(--text-body-small); 530 letter-spacing: 0.08em; 531 color: var(--color-primary); 532 } 533 .dg-feature .ds-heading { font-size: 1.3125rem; } 534 .dg-feature .ds-heading em { font-style: normal; color: var(--color-primary); } 535 .dg-feature > .ds-text { margin-top: var(--space-sm); text-wrap: pretty; } 536 537 /* Reviews â marquee */ 538 .dg-reviews { 539 border-top: var(--border-thin) solid color-mix(in srgb, var(--color-neutral-white) 6%, transparent); 540 border-bottom: var(--border-thin) solid color-mix(in srgb, var(--color-neutral-white) 6%, transparent); 541 overflow: hidden; 542 } 543 .dg-reviews .dg-section-head { padding: 0 var(--space-lg); } 544 .dg-reviews__avg { 545 display: flex; 546 align-items: baseline; 547 justify-content: center; 548 gap: 0.875rem; 549 margin-top: 1.25rem; 550 } 551 .dg-reviews__num { 552 font-family: var(--font-brand); 553 font-size: 3.75rem; 554 font-weight: 700; 555 color: var(--color-primary); 556 line-height: 1; 557 font-variant-numeric: tabular-nums; 558 } 559 .dg-marquee { position: relative; margin-top: 3rem; } 560 .dg-marquee::before, 561 .dg-marquee::after { 562 content: ''; 563 position: absolute; 564 top: 0; 565 bottom: 0; 566 width: 7.5rem; 567 z-index: 2; 568 pointer-events: none; 569 } 570 .dg-marquee::before { left: 0; background: linear-gradient(90deg, var(--color-background), transparent); } 571 .dg-marquee::after { right: 0; background: linear-gradient(270deg, var(--color-background), transparent); } 572 @media (max-width: 640px) { 573 .dg-marquee::before, .dg-marquee::after { width: 2.5rem; } 574 .dg-review { width: 17.5rem; } 575 } 576 .dg-marquee__track { 577 display: flex; 578 gap: 1.25rem; 579 width: max-content; 580 } 581 @media (prefers-reduced-motion: no-preference) { 582 .dg-marquee__track { animation: dgMarquee 36s linear infinite; } 583 } 584 @media (prefers-reduced-motion: reduce) { 585 .dg-marquee { overflow-x: auto; } 586 .dg-marquee::before, .dg-marquee::after { display: none; } 587 .dg-marquee__copy--dup { display: none; } 588 } 589 .dg-marquee__copy { display: flex; gap: 1.25rem; } 590 .dg-review { 591 width: 22.5rem; 592 flex-shrink: 0; 593 padding: var(--space-xs) 0 var(--space-xs) 1.625rem; 594 border-left: 2px solid color-mix(in srgb, var(--color-primary) 45%, transparent); 595 } 596 .dg-review blockquote { 597 margin: 0.625rem 0 0.75rem; 598 font-family: var(--font-plain); 599 font-size: 1.0625rem; 600 line-height: 1.55; 601 font-weight: 300; 602 color: var(--color-on-surface); 603 } 604 605 /* Guides â card-free teasers */ 606 .dg-guides { 607 display: grid; 608 grid-template-columns: repeat(auto-fit, minmax(min(18.75rem, 100%), 1fr)); 609 gap: 1.25rem; 610 margin-top: 3.5rem; 611 } 612 .dg-guide { 613 display: block; 614 text-decoration: none; 615 color: inherit; 616 transition: transform 250ms cubic-bezier(0.2, 0, 0, 1); 617 } 618 .dg-guide:hover { transform: translateY(-4px); } 619 .dg-guide__img { 620 height: 11.25rem; 621 border-radius: var(--radius-card); 622 overflow: hidden; 623 background: var(--ds-glass-surface); 624 } 625 .dg-guide__img img { display: block; width: 100%; height: 100%; object-fit: cover; } 626 .dg-guide .ds-heading { 627 margin-top: 1.125rem; 628 font-size: var(--ds-text-lg); 629 line-height: 1.35; 630 text-wrap: balance; 631 } 632 .dg-guide__more { 633 margin-top: 0.75rem; 634 font-family: var(--font-plain); 635 font-size: var(--text-body-medium); 636 font-weight: 500; 637 color: var(--color-primary); 638 } 639 .dg-guide:hover .dg-guide__more { color: var(--color-accent-primary-soft); } 640 .dg-guides__all { margin-top: 2.25rem; text-align: center; } 641 .dg-guides__all .ds-btn { border: var(--border-thin) solid color-mix(in srgb, var(--color-neutral-white) 14%, transparent); } 642 .dg-guides__all .ds-btn:hover { border-color: var(--color-primary); color: var(--color-accent-primary-soft); background: transparent; } 643
644 /* Timer presets â card-free interval strip */ 645 .dg-timer { 646 list-style: none; 647 margin: 3.5rem 0 0; 648 padding: 0; 649 display: grid; 650 grid-template-columns: repeat(auto-fit, minmax(min(10.5rem, 100%), 1fr)); 651 border-top: var(--border-thin) solid var(--ds-glass-border); 652 border-bottom: var(--border-thin) solid var(--ds-glass-border); 653 } 654 .dg-timer__item { 655 display: flex; 656 flex-direction: column; 657 gap: var(--space-xs); 658 padding: 1.75rem var(--space-lg); 659 border-right: var(--border-thin) solid color-mix(in srgb, var(--color-neutral-white) 8%, transparent); 660 } 661 .dg-timer__item:last-child { border-right: none; } 662 .dg-timer__time { 663 font-family: var(--font-brand); 664 font-size: 2.25rem; 665 font-weight: 700; 666 line-height: 1; 667 color: var(--color-primary); 668 font-variant-numeric: tabular-nums; 669 } 670 .dg-timer__label { 671 font-family: var(--font-plain); 672 font-size: var(--text-label-small); 673 font-weight: 500; 674 text-transform: uppercase; 675 letter-spacing: 0.14em; 676 color: var(--color-on-surface); 677 } 678 #timer .dg-cta-row { margin-top: 2.5rem; } 679 680 /* FAQ â native <details> */ 681 .dg-faq { 682 max-width: 48rem; 683 margin: 3rem auto 0; 684 border-top: var(--border-thin) solid var(--ds-glass-border); 685 } 686 .dg-faq__item { border-bottom: var(--border-thin) solid var(--ds-glass-border); } 687 .dg-faq__item summary { 688 display: flex; 689 justify-content: space-between; 690 align-items: center; 691 gap: var(--space-md); 692 padding: 1.25rem 0; 693 cursor: pointer; 694 list-style: none; 695 font-family: var(--font-plain); 696 font-size: var(--text-body-large); 697 font-weight: 500; 698 color: var(--color-on-surface); 699 } 700 .dg-faq__item summary::-webkit-details-marker { display: none; } 701 .dg-faq__item summary::after { 702 content: '+'; 703 flex-shrink: 0; 704 font-size: 1.5rem; 705 line-height: 1; 706 color: var(--color-primary); 707 transition: transform 200ms cubic-bezier(0.2, 0, 0, 1); 708 } 709 .dg-faq__item[open] summary::after { transform: rotate(45deg); } 710 .dg-faq__item summary:hover { color: var(--color-neutral-white); } 711 .dg-faq__item > .ds-text { padding: 0 0 1.25rem; text-wrap: pretty; } 712 713 /* Final CTA â full-bleed centered */ 714 .dg-cta { 715 position: relative; 716 padding: 7rem 0; 717 overflow: hidden; 718 border-top: var(--border-thin) solid color-mix(in srgb, var(--color-neutral-white) 6%, transparent); 719 background: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--color-primary) 14%, transparent) 0%, transparent 55%); 720 } 721 .dg-cta__inner { 722 position: relative; 723 max-width: 45rem; 724 margin: 0 auto; 725 padding: 0 var(--space-lg); 726 text-align: center; 727 display: flex; 728 flex-direction: column; 729 align-items: center; 730 } 731 .dg-cta__inner .ds-heading { 732 margin-top: var(--space-lg); 733 font-size: clamp(2rem, 4vw + 0.5rem, 3.25rem); 734 line-height: 1.08; 735 letter-spacing: -0.02em; 736 text-wrap: balance; 737 } 738 .dg-cta__lede { 739 margin-top: 1.25rem; 740 max-width: 32rem; 741 font-weight: 300; 742 text-wrap: pretty; 743 } 744 .dg-cta__note { margin-top: var(--space-lg); } 745</style> 746 747
747<script> 748 // Lightweight queue so consumers can call dgAnalytics.track() before the SDK loads. 749 window.dgAnalytics = window.dgAnalytics || (function() { 750 var queue = []; 751 var ready = false; 752 function flush() { 753 if (!window.amplitude || !ready) return; 754 while (queue.length) { 755 var item = queue.shift(); 756 try { window.amplitude.track(item.name, item.props || {}); } catch (e) {} 757 } 758 } 759 var api = { 760 track: function(name, props) { 761 if (ready && window.amplitude && typeof window.amplitude.track === 'function') { 762 try { window.amplitude.track(name, props || {}); } catch (e) {} 763 } else { 764 queue.push({ name: name, props: props }); 765 } 766 }, 767 // Conversions are also sent as a plain event so they show up in 768 // funnels alongside cta_click / page_view. 769 conversion: function(name, props) { 770 var payload = Object.assign({}, props || {}, { conversion: name }); 771 var ctx = window.dgPageContext || {}; 772 if (payload.page_name === undefined) payload.page_name = ctx.page_name || null; 773 if (payload.page_slug === undefined) payload.page_slug = ctx.page_slug || null; 774 api.track('conversion', payload); 775 }, 776 _onReady: function() { ready = true; flush(); } 777 }; 778 return api; 779 })(); 780 781 // Per-page context â read from <meta name="dg:page-*"> tags injected by individual pages. 782 window.dgPageContext = (function() { 783 function meta(name) { 784 var el = document.querySelector('meta[name="' + name + '"]'); 785 return el ? el.getAttribute('content') : null; 786 } 787 return { 788 page_name: meta('dg:page-name') || window.location.pathname.replace(/^\/+|\/+$/g, '') || 'home', 789 page_type: meta('dg:page-type') || 'page', 790 page_slug: meta('dg:page-slug') || null, 791 }; 792 })(); 793</script>
vendor: 1 bytes, line 793
793
794<script type="module"> 795 import * as amplitude from 'https://cdn.jsdelivr.net/npm/@amplitude/[email protected]/+esm'; 796 window.amplitude = amplitude; 797 amplitude.init("59d3bf7380bdb8ccaa2c9040fb43b2f0", undefined, { 798 serverZone: "US", 799 defaultTracking: { 800 attribution: true, 801 pageViews: false, // we send our own 802 sessions: true, 803 formInteractions: true, 804 fileDownloads: true, 805 }, 806 }); 807 808 var ctx = window.dgPageContext; 809 amplitude.track('page_view', { 810 page_name: ctx.page_name, 811 page_type: ctx.page_type, 812 page_slug: ctx.page_slug, 813 page_path: window.location.pathname, 814 page_url: window.location.href, 815 referrer: document.referrer || null, 816 }); 817 window.dgAnalytics._onReady(); 818 819 // CTAs whose click is itself a conversion. Anything else tagged with 820 // data-cta still emits cta_click, just not a conversion. 821 var CONVERSION_CTAS = ['download_app', 'start_practice', 'subscribe']; 822 823 function flushNow() { 824 try { amplitude.flush(); } catch (e) {} 825 } 826 window.dgAnalytics.flush = flushNow; 827 828 // Last chance to deliver queued events when the tab goes away. 829 window.addEventListener('pagehide', function() { 830 try { amplitude.setTransport('beacon'); } catch (e) {} 831 flushNow(); 832 }); 833 834 // Outbound + CTA + conversion auto-tracking 835 document.addEventListener('click', function(e) { 836 var a = e.target.closest('a'); 837 if (!a) return; 838 var href = a.getAttribute('href') || ''; 839 if (!href || href.startsWith('#') || href.startsWith('mailto:') || href.startsWith('tel:')) return; 840 841 var isExternal = /^https?:\/\//i.test(href) && !href.includes(window.location.host); 842 if (isExternal) { 843 window.dgAnalytics.track('outbound_click', { 844 href: href, 845 text: (a.innerText || '').trim().slice(0, 120), 846 page_name: ctx.page_name, 847 page_slug: ctx.page_slug, 848 }); 849 } 850 if (a.dataset && a.dataset.cta) { 851 window.dgAnalytics.track('cta_click', { 852 cta: a.dataset.cta, 853 cta_location: a.dataset.ctaLocation || null, 854 cta_destination: a.dataset.ctaDestination || href, 855 href: href, 856 page_name: ctx.page_name, 857 page_slug: ctx.page_slug, 858 }); 859 if (CONVERSION_CTAS.indexOf(a.dataset.cta) !== -1) { 860 window.dgAnalytics.conversion(a.dataset.cta, { 861 destination: a.dataset.ctaDestination || null, 862 cta_location: a.dataset.ctaLocation || null, 863 plan: a.dataset.ctaPlan || null, 864 }); 865 } 866 // Same-tab CTAs unload the page before the next flush interval, 867 // so push the queued events out now. 868 if (!a.target || a.target === '_self') flushNow(); 869 } 870 }, { passive: true }); 871 872 document.addEventListener('submit', function(e) { 873 var form = e.target; 874 if (form && form.dataset && form.dataset.conversion) { 875 window.dgAnalytics.track('conversion', { 876 conversion: form.dataset.conversion, 877 page_name: ctx.page_name, 878 page_slug: ctx.page_slug, 879 }); 880 } 881 }, { passive: true }); 882 883 // Scroll depth â 25 / 50 / 75 / 100 884 (function() { 885 var marks = [25, 50, 75, 100]; 886 var fired = {}; 887 function onScroll() { 888 var doc = document.documentElement; 889 var max = doc.scrollHeight - doc.clientHeight; 890 if (max <= 0) return; 891 var pct = Math.min(100, Math.round((doc.scrollTop || window.scrollY) / max * 100)); 892 marks.forEach(function(m) { 893 if (!fired[m] && pct >= m) { 894 fired[m] = true; 895 window.dgAnalytics.track('scroll_depth', { 896 depth: m, 897 page_name: ctx.page_name, 898 page_slug: ctx.page_slug, 899 }); 900 } 901 }); 902 } 903 window.addEventListener('scroll', onScroll, { passive: true }); 904 onScroll(); 905 })(); 906</script>
906 907</head> 908<body class="ds-page"> 909 910<header class="ds-navbar"> 911 <input type="checkbox" id="ds-nav-toggle" class="ds-navbar__toggle-input" aria-hidden="true"> 912 913 <div class="ds-container"><div class="ds-navbar__inner"> 914 <a href="https://drawgestures.com" class="ds-navbar__brand" aria-label="DrawGestures â Home"> 915 <img src="https://drawgestures.com/images/logo-mark.png" alt="" width="30" height="30"> 916 <span class="ds-navbar__wordmark">DrawGestures</span> 917 </a> 918 919 <nav aria-label="Primary"> 920 <ul class="ds-navbar__links"> 921 <li> 922 <a href="https://drawgestures.com/guides" 923 class="ds-navbar__link " 924 >Guides</a> 925 </li> 926 <li> 927 <a href="https://app.drawgestures.com/pricing" 928 class="ds-navbar__link " 929 data-cta="view_pricing" data-cta-location="navbar" data-cta-destination="web_app" >Pricing</a> 930 </li> 931 <li> 932 <a href="https://drawgestures.com/challenge" 933 class="ds-navbar__link " 934 >Challenge</a> 935 </li> 936 <li> 937 <a href="https://drawgestures.com/about" 938 class="ds-navbar__link " 939 >About</a> 940 </li> 941 </ul> 942 </nav> 943 944 <div class="ds-navbar__cta ds-navbar__cta--desktop"> 945 <a href="https://drawgestures.com/download" class="ds-btn ds-btn--primary ds-btn--sm" data-cta="download_nav" data-cta-location="navbar" data-cta-destination="download_page" >Download</a> 946 </div> 947 948 <label for="ds-nav-toggle" class="ds-navbar__toggle" role="button" aria-label="Toggle navigation menu"> 949 <svg class="ds-navbar__icon-open" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="4" x2="20" y1="6" y2="6"/><line x1="4" x2="20" y1="12" y2="12"/><line x1="4" x2="20" y1="18" y2="18"/></svg> 950 <svg class="ds-navbar__icon-close" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> 951 </label> 952 </div></div> 953 954 <nav class="ds-navbar__mobile" aria-label="Primary mobile"> 955 <a href="https://drawgestures.com/guides" 956 class="ds-navbar__link " 957 >Guides</a> 958 <a href="https://app.drawgestures.com/pricing" 959 class="ds-navbar__link " 960 data-cta="view_pricing" data-cta-location="navbar_mobile" data-cta-destination="web_app" >Pricing</a> 961 <a href="https://drawgestures.com/challenge" 962 class="ds-navbar__link " 963 >Challenge</a> 964 <a href="https://drawgestures.com/about" 965 class="ds-navbar__link " 966 >About</a> 967 <a href="https://drawgestures.com/download" class="ds-btn ds-btn--primary ds-btn--sm ds-btn--full" data-cta="download_nav" data-cta-location="navbar_mobile" data-cta-destination="download_page" >Download</a> 968 </nav> 969</header> 970 971<main id="main-content"> 972 973 974<section class="dg-hero"> 975 <div class="dg-hero__glow" aria-hidden="true"></div> 976 <div class="dg-hero__copy"> 977 <span class="ds-chip ds-chip--accent ds-chip--md dg-anim">Free · online · iOS · Android · desktop</span> 978 <h1 class="ds-heading ds-heading--display dg-anim dg-anim--d1">The gesture drawing app with a <span class="ds-heading--gradient">built-in timer.</span></h1> 979 <p class="ds-text ds-text--xl ds-text--subtle dg-hero__lede dg-anim dg-anim--d2">Practise gesture drawing online or on your tablet. Pinterest, Google and premium cloud references â <strong>in one place</strong> â 980 with a drawing timer from 30 seconds to 10 minutes. 981 No login. No subscription wall. Just open it and draw.</p> 982 <div class="dg-cta-row dg-anim dg-anim--d3"> 983 <a href="https://app.drawgestures.com" class="ds-btn ds-btn--primary ds-btn--lg" data-cta="start_practice" data-cta-location="home_hero" data-cta-destination="web_app" ><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 984 <path d="M8 5.5l10 6.5-10 6.5V5.5z"/> 985 </svg> 986 Start drawing online</a> 987 <a href="https://drawgestures.com/download" class="ds-btn ds-btn--secondary ds-btn--lg" data-cta="download_app" data-cta-location="home_hero" data-cta-destination="download_page" ><svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> 988 <path d="M12 3v12m0 0l-4.5-4.5M12 15l4.5-4.5M4 20h16"/> 989 </svg> 990 Download the app</a> 991 </div> 992 <div class="dg-platforms dg-anim dg-anim--d3b"> 993 <a href="https://drawgestures.com/download" class="dg-platform" title="Download for iPhone & iPad" 994 data-cta="download_app" data-cta-location="home_hero_platforms" data-cta-destination="download_page" data-platform="ios"> 995 <svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 996 <path d="M16.3 12.8c0-2.2 1.8-3.2 1.9-3.3-1-1.5-2.6-1.7-3.2-1.7-1.4-.1-2.7.8-3.4.8-.7 0-1.8-.8-2.9-.8-1.5 0-2.9.9-3.7 2.2-1.6 2.7-.4 6.8 1.1 9 .8 1.1 1.7 2.3 2.8 2.3 1.1 0 1.6-.7 2.9-.7 1.3 0 1.7.7 2.9.7 1.2 0 1.9-1.1 2.7-2.2.8-1.2 1.2-2.4 1.2-2.5-.1 0-2.3-.9-2.3-3.8zM14.2 5.7c.6-.8 1-1.8.9-2.9-.9 0-2 .6-2.6 1.4-.6.7-1.1 1.8-.9 2.8 1 .1 2-.5 2.6-1.3z"/> 997 </svg> 998 iOS 999 </a> 1000 <a href="https://drawgestures.com/download" class="dg-platform" title="Download for Android" 1001 data-cta="download_app" data-cta-location="home_hero_platforms" data-cta-destination="download_page" data-platform="android"> 1002 <svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1003 <path d="M6 9.5h12v8.2c0 .7-.6 1.3-1.3 1.3H15v2.4c0 .8-.6 1.4-1.4 1.4s-1.4-.6-1.4-1.4V19h-1.4v2.4c0 .8-.6 1.4-1.4 1.4S8 22.2 8 21.4V19H7.3c-.7 0-1.3-.6-1.3-1.3V9.5zM3.6 9.4c.8 0 1.4.6 1.4 1.4v4.7c0 .8-.6 1.4-1.4 1.4s-1.4-.6-1.4-1.4v-4.7c0-.8.6-1.4 1.4-1.4zm16.8 0c.8 0 1.4.6 1.4 1.4v4.7c0 .8-.6 1.4-1.4 1.4s-1.4-.6-1.4-1.4v-4.7c0-.8.6-1.4 1.4-1.4zM15.6 2.6l1.1-1.9c.1-.2 0-.4-.1-.5-.2-.1-.4 0-.5.2l-1.1 2c-.9-.4-1.9-.6-3-.6s-2.1.2-3 .6l-1.1-2c-.1-.2-.3-.3-.5-.2-.2.1-.2.3-.1.5l1.1 1.9C6.4 3.8 5 5.8 5 8.1h14c0-2.3-1.4-4.3-3.4-5.5zM9.3 5.9c-.4 0-.7-.3-.7-.7s.3-.7.7-.7.7.3.7.7-.3.7-.7.7zm5.4 0c-.4 0-.7-.3-.7-.7s.3-.7.7-.7.7.3.7.7-.3.7-.7.7z"/> 1004 </svg> 1005 Android 1006 </a> 1007 <a href="https://drawgestures.com/download" class="dg-platform" title="Download for Windows" 1008 data-cta="download_app" data-cta-location="home_hero_platforms" data-cta-destination="download_page" data-platform="windows"> 1009 <svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1010 <path d="M3 5.6l7.6-1v7.1H3V5.6zm0 12.8l7.6 1v-7H3v6zm8.6 1.2L22 21V12.7h-10.4v6.9zm0-15.2v7.3H22V3l-10.4 1.4z"/> 1011 </svg> 1012 Windows 1013 </a> 1014 <a href="https://drawgestures.com/download" class="dg-platform" title="Download for Mac" 1015 data-cta="download_app" data-cta-location="home_hero_platforms" data-cta-destination="download_page" data-platform="macos"> 1016 <svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1017 <path d="M16.3 12.8c0-2.2 1.8-3.2 1.9-3.3-1-1.5-2.6-1.7-3.2-1.7-1.4-.1-2.7.8-3.4.8-.7 0-1.8-.8-2.9-.8-1.5 0-2.9.9-3.7 2.2-1.6 2.7-.4 6.8 1.1 9 .8 1.1 1.7 2.3 2.8 2.3 1.1 0 1.6-.7 2.9-.7 1.3 0 1.7.7 2.9.7 1.2 0 1.9-1.1 2.7-2.2.8-1.2 1.2-2.4 1.2-2.5-.1 0-2.3-.9-2.3-3.8zM14.2 5.7c.6-.8 1-1.8.9-2.9-.9 0-2 .6-2.6 1.4-.6.7-1.1 1.8-.9 2.8 1 .1 2-.5 2.6-1.3z"/> 1018 </svg> 1019 macOS 1020 </a> 1021 </div> 1022 <div class="dg-rating dg-anim dg-anim--d4">
1023 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1024 <span>4.6 · 2,100+ reviews</span> 1025 <span class="dg-rating__sep">·</span> 1026 <span>iOS · Android · Tablet</span> 1027 </div> 1028 </div> 1029 <div class="dg-hero__stage"> 1030 <div class="dg-phone dg-anim dg-anim--d5"> 1031 <img src="https://drawgestures.com/images/app_home_page.png" 1032 alt="DrawGestures app â Practice Session screen" 1033 fetchpriority="high"> 1034 </div> 1035 </div> 1036 <div class="dg-hero__rule" aria-hidden="true"></div> 1037</section> 1038 1039 1040<section class="ds-section--lg dg-sec" id="about"><div class="ds-container"><div class="dg-section-head dg-about__copy" data-reveal> 1041 <span class="dg-eyebrow">About</span> 1042 <h2 class="ds-heading ds-heading--xl">A free gesture drawing app for <span class="ds-heading--gradient">gesture & figure</span> practice.</h2> 1043 <p class="ds-text ds-text--lg ds-text--subtle"><strong class="dg-strong">DrawGestures</strong> brings Pinterest, Google and premium cloud libraries together, provides a distraction-free viewer with timers, and lets you sketch on top of references on tablets and desktops.</p> 1044 <p class="ds-text ds-text--lg ds-text--subtle">It's the warm-up most pro animators run before any longer figure study â and the timer is the entire skill.</p> 1045 </div> 1046 1047 <div class="dg-facts" data-reveal> 1048 <div> 1049 <p class="dg-facts__label">Sign-up</p> 1050 <p class="dg-facts__value">No login required to start a timed session.</p> 1051 </div> 1052 <div> 1053 <p class="dg-facts__label">Devices</p> 1054 <p class="dg-facts__value">Tablet-friendly, lightweight UI. iOS, Android, tablet, desktop.</p> 1055 </div> 1056 <div> 1057 <p class="dg-facts__label">Homepage</p> 1058 <p class="dg-facts__value"><span class="ds-text ds-text--md ds-text--mono">drawgestures.com</span> 1059</p> 1060 </div> 1061 <div> 1062 <p class="dg-facts__label">Price</p> 1063 <p class="dg-facts__value">Free tier · Pro from $2.99 / month.</p> 1064 </div> 1065 </div> 1066 1067 <div class="dg-gdata" data-reveal data-reveal-delay="100"> 1068 <h3 class="ds-heading ds-heading--sm">Why we request Google data.</h3> 1069 <p class="ds-text ds-text--md ds-text--muted dg-gdata__intro">Some features use your Google account to improve your experience, for example:</p> 1070 <div class="dg-gdata__grid"> 1071 <div class="dg-gdata__item"> 1072 <span class="dg-gdata__ix">i</span> 1073 <p class="ds-text ds-text--md ds-text--muted"><em>Sign in with Google</em> â sync preferences across devices.</p> 1074 </div> 1075 <div class="dg-gdata__item"> 1076 <span class="dg-gdata__ix">ii</span> 1077 <p class="ds-text ds-text--md ds-text--muted"><em>Google Images search</em> â fetch public reference thumbnails.</p> 1078 </div> 1079 <div class="dg-gdata__item"> 1080 <span class="dg-gdata__ix">iii</span> 1081 <p class="ds-text ds-text--md ds-text--muted"><em>Analytics</em> â understand anonymous usage and improve the app.</p> 1082 </div> 1083 </div> 1084 <p class="ds-text ds-text--sm ds-text--muted dg-gdata__legal">We only request the minimum necessary permissions and do not sell your data. Learn more in our <a href="https://drawgestures.com/privacy">Privacy Policy</a> · <a href="https://drawgestures.com/terms">Terms of Service</a>.</p> 1085 </div></div></section> 1086 1087 1088<section class="ds-section--lg dg-sec" id="features"><div class="ds-container"><div class="dg-section-head" data-reveal> 1089 <span class="dg-eyebrow">Features</span> 1090 <h2 class="ds-heading ds-heading--xl">Everything you need for <span class="ds-heading--gradient">better practice.</span></h2> 1091 <p class="ds-text ds-text--lg ds-text--subtle">Curated libraries, a distraction-free viewer, drawing tools that get out of your way, and rock-solid tablet support. Six things, done well, instead of fifty done badly.</p> 1092 </div> 1093 1094 <div class="dg-features"> 1095 <div class="dg-feature" data-reveal data-reveal-delay="0"> 1096 <div class="dg-feature__illo dg-feature__illo--logo "> 1097 <div class="dg-pins" aria-hidden="true"> 1098 <div class="dg-pins__col" style="--offset: 1.5rem"> 1099 <sp
1099an class="dg-pins__cell" style="--h: 4.5rem; --hue: 12; --d: 0ms"></span> 1100 <span class="dg-pins__cell" style="--h: 3.25rem; --hue: 200; --d: 140ms"></span> 1101 <span class="dg-pins__cell" style="--h: 5.5rem; --hue: 95; --d: 280ms"></span> 1102 <span class="dg-pins__cell" style="--h: 3.75rem; --hue: 330; --d: 420ms"></span> 1103 </div> 1104 <div class="dg-pins__col" style="--offset: 0rem"> 1105 <span class="dg-pins__cell" style="--h: 3.5rem; --hue: 160; --d: 140ms"></span> 1106 <span class="dg-pins__cell" style="--h: 6rem; --hue: 28; --d: 280ms"></span> 1107 <span class="dg-pins__cell" style="--h: 4rem; --hue: 260; --d: 420ms"></span> 1108 <span class="dg-pins__cell" style="--h: 3.5rem; --hue: 60; --d: 560ms"></span> 1109 </div> 1110 <div class="dg-pins__col" style="--offset: 2.75rem"> 1111 <span class="dg-pins__cell" style="--h: 5.75rem; --hue: 290; --d: 280ms"></span> 1112 <span class="dg-pins__cell" style="--h: 3.5rem; --hue: 45; --d: 420ms"></span> 1113 <span class="dg-pins__cell" style="--h: 4.5rem; --hue: 180; --d: 560ms"></span> 1114 <span class="dg-pins__cell" style="--h: 5rem; --hue: 12; --d: 700ms"></span> 1115 </div> 1116 <div class="dg-pins__col" style="--offset: 0.75rem"> 1117 <span class="dg-pins__cell" style="--h: 3.75rem; --hue: 75; --d: 420ms"></span> 1118 <span class="dg-pins__cell" style="--h: 5rem; --hue: 220; --d: 560ms"></span> 1119 <span class="dg-pins__cell" style="--h: 3.5rem; --hue: 350; --d: 700ms"></span> 1120 <span class="dg-pins__cell" style="--h: 5.5rem; --hue: 140; --d: 840ms"></span> 1121 </div> 1122 <div class="dg-pins__col" style="--offset: 2rem"> 1123 <span class="dg-pins__cell" style="--h: 4.75rem; --hue: 240; --d: 560ms"></span> 1124 <span class="dg-pins__cell" style="--h: 3.75rem; --hue: 10; --d: 700ms"></span> 1125 <span class="dg-pins__cell" style="--h: 5.5rem; --hue: 120; --d: 840ms"></span> 1126 <sp
1126an class="dg-pins__cell" style="--h: 3.5rem; --hue: 300; --d: 980ms"></span> 1127 </div> 1128 <div class="dg-pins__col" style="--offset: 0.25rem"> 1129 <span class="dg-pins__cell" style="--h: 5.25rem; --hue: 35; --d: 700ms"></span> 1130 <span class="dg-pins__cell" style="--h: 4.25rem; --hue: 170; --d: 840ms"></span> 1131 <span class="dg-pins__cell" style="--h: 3.25rem; --hue: 270; --d: 980ms"></span> 1132 <span class="dg-pins__cell" style="--h: 5rem; --hue: 85; --d: 1120ms"></span> 1133 </div> 1134 <div class="dg-pins__col" style="--offset: 1.75rem"> 1135 <span class="dg-pins__cell" style="--h: 3.5rem; --hue: 320; --d: 840ms"></span> 1136 <span class="dg-pins__cell" style="--h: 5.5rem; --hue: 110; --d: 980ms"></span> 1137 <span class="dg-pins__cell" style="--h: 4rem; --hue: 20; --d: 1120ms"></span> 1138 <span class="dg-pins__cell" style="--h: 4.5rem; --hue: 210; --d: 1260ms"></span> 1139 </div> 1140 </div> 1141 <span class="dg-feature__mark"> 1142 <svg class="sk-icon sk-icon--pinterest" width="52" height="52" viewBox="0 0 24 24" fill="#E60023" aria-hidden="true"> 1143 <path d="M12 0C5.373 0 0 5.372 0 12c0 5.084 3.163 9.426 7.627 11.174-.105-.949-.2-2.405.042-3.441.218-.937 1.407-5.965 1.407-5.965s-.359-.719-.359-1.782c0-1.668.967-2.914 2.171-2.914 1.023 0 1.518.769 1.518 1.69 0 1.029-.655 2.568-.994 3.995-.283 1.194.599 2.169 1.777 2.169 2.133 0 3.772-2.249 3.772-5.495 0-2.873-2.064-4.882-5.012-4.882-3.414 0-5.418 2.561-5.418 5.207 0 1.031.397 2.138.893 2.738a.36.36 0 0 1 .083.345l-.333 1.36c-.053.22-.174.267-.402.161-1.499-.698-2.436-2.889-2.436-4.649 0-3.785 2.75-7.262 7.929-7.262 4.163 0 7.398 2.967 7.398 6.931 0 4.136-2.607 7.464-6.227 7.464-1.216 0-2.359-.632-2.75-1.378l-.748 2.853c-.271 1.043-1.002 2.35-1.492 3.146C9.57 23.812 10.763 24 12 24c6.627 0 12-5.373 12-12S18.627 0 12 0z"/> 1144 </svg> 1145 </span> 1146 </div> 1147 <div class="dg-feature__head"> 1148 <span class="dg-feature__num">01</span> 1149 <h3 class="ds-heading ds-heading--sm"><em>Pinterest</em> library</h3> 1150 </div> 1151 <p class="ds-text ds-text--md ds-text--muted">Browse and stream poses directly from any Pinterest board. Boards refresh; your library stays fresh forever.</p> 1152 </div> 1153 <div class="dg-feature" data-reveal data-reveal-delay="90"> 1154 <div class="dg-feature__illo dg-feature__illo--logo "> 1155 <div class="dg-drive" aria-hidden="true"> 1156 <span class="dg-drive__folder" style="--d: 0ms"> 1157 <svg class="dg-drive__icon is-grey" viewBox="0 0 24 24" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg>
1158 <span class="dg-drive__name" style="--w: 72%"></span> 1159 </span> 1160 <span class="dg-drive__folder" style="--d: 110ms"> 1161 <svg class="dg-drive__icon" viewBox="0 0 24 24" style="--hue: 215" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1162 <span class="dg-drive__name" style="--w: 58%"></span> 1163 </span> 1164 <span class="dg-drive__folder" style="--d: 220ms"> 1165 <svg class="dg-drive__icon is-grey" viewBox="0 0 24 24" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1166 <span class="dg-drive__name" style="--w: 80%"></span> 1167 </span> 1168 <span class="dg-drive__folder" style="--d: 330ms"> 1169 <svg class="dg-drive__icon" viewBox="0 0 24 24" style="--hue: 140" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1170 <span class="dg-drive__name" style="--w: 64%"></span> 1171 </span> 1172 <span class="dg-drive__folder" style="--d: 440ms"> 1173 <svg class="dg-drive__icon is-grey" viewBox="0 0 24 24" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1174 <span class="dg-drive__name" style="--w: 52%"></span> 1175 </span> 1176 <span class="dg-drive__folder" style="--d: 550ms"> 1177 <svg class="dg-drive__icon" viewBox="0 0 24 24" style="--hue: 30" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1178 <span class="dg-drive__name" style="--w: 76%"></span> 1179 </span> 1180 <span class="dg-drive__folder" style="--d: 660ms"> 1181 <svg class="dg-drive__icon is-grey" viewBox="0 0 24 24" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1182 <span class="dg-drive__name" style="--w: 60%"></span> 1183 </span> 1184 <span class="dg-drive__folder" style="--d: 770ms"> 1185 <svg class="dg-drive__icon" viewBox="0 0 24 24" style="--hue: 350" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1186 <span class="dg-drive__name" style="--w: 70%"></span> 1187 </span> 1188 <span class="dg-drive__folder" style="--d: 880ms"> 1189 <svg class="dg-drive__icon is-grey" viewBox="0 0 24 24" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1190 <span class="dg-drive__name" style="--w: 66%"></span> 1191 </span> 1192 <span class="dg-drive__folder" style="--d: 990ms"> 1193 <svg class="dg-drive__icon" viewB
1193ox="0 0 24 24" style="--hue: 45" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1194 <span class="dg-drive__name" style="--w: 54%"></span> 1195 </span> 1196 <span class="dg-drive__folder" style="--d: 1100ms"> 1197 <svg class="dg-drive__icon is-grey" viewBox="0 0 24 24" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1198 <span class="dg-drive__name" style="--w: 74%"></span> 1199 </span> 1200 <span class="dg-drive__folder" style="--d: 1210ms"> 1201 <svg class="dg-drive__icon" viewBox="0 0 24 24" style="--hue: 190" ><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg> 1202 <span class="dg-drive__name" style="--w: 62%"></span> 1203 </span> 1204 </div> 1205 <span class="dg-feature__mark"> 1206 <svg class="sk-icon sk-icon--google-drive" width="52" height="52" viewBox="0 0 87.3 78" fill="none" aria-hidden="true"> 1207 <path d="M6.6 66.85l3.85 6.65c.8 1.4 1.95 2.5 3.3 3.3l13.75-23.8H0c0 1.55.4 3.1 1.2 4.5z" fill="#0066DA"/> 1208 <path d="M43.65 25L29.9 1.2c-1.35.8-2.5 1.9-3.3 3.3L1.2 48.5A9.06 9.06 0 0 0 0 53h27.5z" fill="#00AC47"/> 1209 <path d="M73.55 76.8c1.35-.8 2.5-1.9 3.3-3.3l1.6-2.75 7.65-13.25c.8-1.4 1.2-2.95 1.2-4.5H59.798l5.852 11.5z" fill="#EA4335"/> 1210 <path d="M43.65 25L57.4 1.2C56.05.4 54.5 0 52.9 0H34.4c-1.6 0-3.15.45-4.5 1.2z" fill="#00832D"/> 1211 <path d="M59.8 53H27.5L13.75 76.8c1.35.8 2.9 1.2 4.5 1.2h50.8c1.6 0 3.15-.45 4.5-1.2z" fill="#2684FC"/> 1212 <path d="M73.4 26.5L60.7 4.5c-.8-1.4-1.95-2.5-3.3-3.3L43.65 25l16.15 28h27.45c0-1.55-.4-3.1-1.2-4.5z" fill="#FFBA00"/> 1213 </svg> 1214 </span> 1215 </div> 1216 <div class="dg-feature__head"> 1217 <span class="dg-feature__num">02</span> 1218 <h3 class="ds-heading ds-heading--sm"><em>Google</em> library</h3> 1219 </div> 1220 <p class="ds-text ds-text--md ds-text--muted">Quickly search Google Images for references without leaving the app. Thumbnails fetched on demand.</p> 1221 </div> 1222 <div class="dg-feature" data-reveal data-reveal-delay="0"> 1223 <div class="dg-feature__illo "> 1224 <img src="https://drawgestures.com/images/illustrations/home_feature_cloud.webp" alt="" loading="lazy" decoding="async"> 1225 </div> 1226 <div class="dg-feature__head"> 1227 <span class="dg-feature__num">03</span> 1228 <h3 class="ds-heading ds-heading--sm">Premium <em>cloud</em> library</h3> 1229 </div> 1230 <p class="ds-text ds-text--md ds-text--muted">Curated, ready-to-draw collections from our cloud. Always available, always fresh, no setup required.</p> 1231 </div> 1232 <div class="dg-feature" data-reveal data-reveal-delay="90"> 1233 <div class="dg-feature__illo "> 1234 <img src="https://drawgestures.com/images/illustrations/home_feature_draw_on_top.webp" alt="" loading="lazy" decoding="async"> 1235 </div> 1236 <div class="dg-feature__head"> 1237 <span class="dg-feature__num">04</span> 1238 <h3 class="ds-heading ds-heading--sm">Draw on <em>top of image</em></h3> 1239 </div> 1240 <p class="ds-text ds-text--md ds-text--muted">Sketch rhythms and landmarks right on the reference with lightweight tools â pen, eraser, opacity, undo.</p> 1241 </div> 1242 <div class="dg-feature" data-reveal data-reveal-delay="180"> 1243 <div class="dg-feature__illo "> 1244 <img src="https://drawgestures.com/images/illustrations/home_feature_tablet.webp" alt="" loading="lazy" decoding="async"> 1245 </div> 1246 <div class="dg-feature__head">
1247 <span class="dg-feature__num">05</span> 1248 <h3 class="ds-heading ds-heading--sm"><em>Tablet</em> support</h3> 1249 </div> 1250 <p class="ds-text ds-text--md ds-text--muted">Optimised for iPad and Android tablets. Pen input, palm rejection, keyboard shortcuts. Works on desktop too.</p> 1251 </div> 1252 <div class="dg-feature" data-reveal data-reveal-delay="0"> 1253 <div class="dg-feature__illo "> 1254 <img src="https://drawgestures.com/images/illustrations/home_feature_timer.webp" alt="" loading="lazy" decoding="async"> 1255 </div> 1256 <div class="dg-feature__head"> 1257 <span class="dg-feature__num">06</span> 1258 <h3 class="ds-heading ds-heading--sm">Gesture drawing <em>timer</em></h3> 1259 </div> 1260 <p class="ds-text ds-text--md ds-text--muted">A drawing timer from 30-second gestures to long-form figure work, with auto-advance and shuffle. The pressure is the practice.</p> 1261 </div> 1262 </div></div></section> 1263 1264 1265<section class="ds-section--lg dg-sec" id="timer"><div class="ds-container"><div class="dg-section-head" data-reveal> 1266 <span class="dg-eyebrow">Drawing timer</span> 1267 <h2 class="ds-heading ds-heading--xl">A gesture drawing timer that <span class="ds-heading--gradient">keeps you honest.</span></h2> 1268 <p class="ds-text ds-text--lg ds-text--subtle">The timer is the skill. It caps every pose, advances to the next reference on its own, and stops you fussing over details. Pick a preset, press start, draw.</p> 1269 </div> 1270 1271 <ol class="dg-timer" data-reveal> 1272 <li class="dg-timer__item"> 1273 <span class="dg-timer__time">30s</span> 1274 <span class="dg-timer__label">Warm-up</span> 1275 <span class="ds-text ds-text--sm ds-text--muted">Line of action and commitment. Always start here.</span> 1276 </li> 1277 <li class="dg-timer__item"> 1278 <span class="dg-timer__time">1m</span> 1279 <span class="dg-timer__label">Daily bulk</span> 1280 <span class="ds-text ds-text--sm ds-text--muted">Line of action plus rhythm through the pose.</span> 1281 </li> 1282 <li class="dg-timer__item"> 1283 <span class="dg-timer__time">2m</span> 1284 <span class="dg-timer__label">Masses</span> 1285 <span class="ds-text ds-text--sm ds-text--muted">Add the ribcage and pelvis once you are warm.</span> 1286 </li> 1287 <li class="dg-timer__item"> 1288 <span class="dg-timer__time">5m</span> 1289 <span class="dg-timer__label">Block-in</span> 1290 <span class="ds-text ds-text--sm ds-text--muted">Light construction. Crosses into figure drawing.</span> 1291 </li> 1292 <li class="dg-timer__item"> 1293 <span class="dg-timer__time">10m</span> 1294 <span class="dg-timer__label">Long pose</span> 1295 <span class="ds-text ds-text--sm ds-text--muted">Construction and anatomy. Save it for the end.</span> 1296 </li> 1297 </ol> 1298 1299 <div class="dg-cta-row" data-reveal> 1300 <a href="https://app.drawgestures.com" class="ds-btn ds-btn--primary ds-btn--lg" data-cta="start_practice" data-cta-location="home_timer" data-cta-destination="web_app" ><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1301 <path d="M8 5.5l10 6.5-10 6.5V5.5z"/> 1302 </svg> 1303 Open the timer in your browser</a> 1304 <a href="https://drawgestures.com/guides/drawing-timer" class="ds-btn ds-btn--ghost ds-btn--lg" >How to use a drawing timer â</a> 1305 </div></div></section> 1306 1307 1308<section class="ds-section--lg dg-sec dg-reviews" id="reviews"><div class="dg-section-head" data-reveal>
1309 <span class="dg-eyebrow">From the field</span> 1310 <h2 class="ds-heading ds-heading--xl">What <span class="ds-heading--gradient">artists</span> are saying.</h2> 1311 <div class="dg-reviews__avg"> 1312 <span class="dg-reviews__num" id="dg-rating-num">4.6</span> 1313 <span class="ds-text ds-text--md ds-text--muted"><span class="dg-stars" aria-hidden="true">â â â â â </span> · <span id="dg-rating-count">2,100+</span> reviews</span> 1314 </div> 1315 </div> 1316 1317 <div class="dg-marquee"> 1318 <div class="dg-marquee__track"> 1319 <div class="dg-marquee__copy " > 1320 <div class="dg-review"> 1321 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1322 <blockquote>Great app for timed gesture drawing sessions.</blockquote> 1323 <div class="ds-text ds-text--sm ds-text--muted">Google Play · v3.7.1 · 2023</div> 1324 </div> 1325 <div class="dg-review"> 1326 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1327 <blockquote>Pinterest feature works perfectly now! Best app for gesture drawing.</blockquote> 1328 <div class="ds-text ds-text--sm ds-text--muted">Google Play · v3.6.4 · 2019</div> 1329 </div> 1330 <div class="dg-review"> 1331 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1332 <blockquote>There's a great collection of images of all kinds already in the app. Offline works too.</blockquote> 1333 <div class="ds-text ds-text--sm ds-text--muted">Google Play · v6.3.2 · 2023</div> 1334 </div> 1335 <div class="dg-review"> 1336 <span class="dg-stars" aria-hidden="true">â â â â <span class="dg-stars--dim">â </span></span> 1337 <blockquote>Simple to use and functional. Great alternative if you can't be online 24/7.</blockquote> 1338 <div class="ds-text ds-text--sm ds-text--muted">Community Feedback · 2023</div> 1339 </div> 1340 </div> 1341 <div class="dg-marquee__copy dg-marquee__copy--dup" aria-hidden="true" > 1342 <div class="dg-review"> 1343 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1344 <blockquote>Great app for timed gesture drawing sessions.</blockquote> 1345 <div class="ds-text ds-text--sm ds-text--muted">Google Play · v3.7.1 · 2023</div> 1346 </div> 1347 <div class="dg-review"> 1348 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1349 <blockquote>Pinterest feature works perfectly now! Best app for gesture drawing.</blockquote> 1350 <div class="ds-text ds-text--sm ds-text--muted">Google Play · v3.6.4 · 2019</div> 1351 </div> 1352 <div class="dg-review"> 1353 <span class="dg-stars" aria-hidden="true">â â â â â </span> 1354 <blockquote>There's a great collection of images of all kinds already in the app. Offline works too.</blockquote> 1355 <div class="ds-text ds-text--sm ds-text--muted">Google Play · v6.3.2 · 2023</div> 1356 </div> 1357 <div class="dg-review"> 1358 <span class="dg-stars" aria-hidden="true">â â â â <span class="dg-stars--dim">â </span></span> 1359 <blockquote>Simple to use and functional. Great alternative if you can't be online 24/7.</blockquote> 1360 <div class="ds-text ds-text--sm ds-text--muted">Community Feedback · 2023</div> 1361 </div> 1362 </div> 1363 </div> 1364 </div></section> 1365 1366 1367<section class="ds-section--lg dg-sec" id="guides"><div class="ds-container"><div class="dg-section-head" data-reveal>
1368 <span class="dg-eyebrow">Guides</span> 1369 <h2 class="ds-heading ds-heading--xl">Learn the craft, <span class="ds-heading--gradient">then practise it.</span></h2> 1370 <p class="ds-text ds-text--lg ds-text--subtle">Free written guides on gesture drawing â what it is, how to practise, and the drills that actually work.</p> 1371 </div> 1372 1373 <div class="dg-guides"> 1374 <a href="https://drawgestures.com/guides/what-is-gesture-drawing" class="dg-guide" data-reveal data-reveal-delay="0"> 1375 <div class="dg-guide__img"> 1376 <img src="https://drawgestures.com/images/illustrations/guide-what-is-gesture-drawing.webp" alt="" loading="lazy" decoding="async"> 1377 </div> 1378 <h3 class="ds-heading ds-heading--xs">What Is Gesture Drawing? A Complete Beginner's Guide</h3> 1379 <div class="dg-guide__more">Read the guide â</div> 1380 </a> 1381 <a href="https://drawgestures.com/guides/gesture-drawing-exercises" class="dg-guide" data-reveal data-reveal-delay="90"> 1382 <div class="dg-guide__img"> 1383 <img src="https://drawgestures.com/images/illustrations/guide-gesture-drawing-exercises.webp" alt="" loading="lazy" decoding="async"> 1384 </div> 1385 <h3 class="ds-heading ds-heading--xs">Gesture Drawing Exercises That Actually Work (10 Drills)</h3> 1386 <div class="dg-guide__more">Read the guide â</div> 1387 </a> 1388 <a href="https://drawgestures.com/guides/gesture-drawing-tips-for-beginners" class="dg-guide" data-reveal data-reveal-delay="180"> 1389 <div class="dg-guide__img"> 1390 <img src="https://drawgestures.com/images/illustrations/guide-gesture-drawing-tips-for-beginners.webp" alt="" loading="lazy" decoding="async"> 1391 </div> 1392 <h3 class="ds-heading ds-heading--xs">Gesture Drawing Tips for Beginners (and 7 Mistakes to Avoid)</h3> 1393 <div class="dg-guide__more">Read the guide â</div> 1394 </a> 1395 </div> 1396 1397 <div class="dg-guides__all"> 1398 <a href="https://drawgestures.com/guides" class="ds-btn ds-btn--ghost ds-btn--md" >Browse all guides â</a> 1399 </div></div></section> 1400 1401 1402<section class="ds-section--lg dg-sec" id="faq"><div class="ds-container"><div class="dg-section-head" data-reveal> 1403 <span class="dg-eyebrow">FAQ</span> 1404 <h2 class="ds-heading ds-heading--xl">Gesture drawing online, <span class="ds-heading--gradient">answered.</span></h2> 1405 </div> 1406 1407 <div class="dg-faq" data-reveal> 1408 <details class="dg-faq__item"> 1409 <summary>What is gesture drawing?</summary> 1410 <p class="ds-text ds-text--md ds-text--muted">Gesture drawing is a quick sketch, usually 30 seconds to 2 minutes, that captures the movement, energy and rhythm of a pose rather than its details. Artists and animators use it as a daily warm-up and as the foundation of figure drawing.</p> 1411 </details> 1412 <details class="dg-faq__item"> 1413 <summary>Is DrawGestures a free gesture drawing app?</summary> 1414 <p class="ds-text ds-text--md ds-text--muted">Yes. The drawing timer, timed sessions and curated reference poses are free on the web, iOS and Android, with no sign-up and no ads. Pro, from $2.99 a month, adds Pinterest and cloud imports, custom intervals and extra session modes.</p> 1415 </details> 1416 <details class="dg-faq__item"> 1417 <summary>Can I practise gesture drawing online in my browser?</summary> 1418 <p class="ds-text ds-text--md ds-text--muted">Yes. Open the DrawGestures web app, pick a reference library, set the drawing timer and start drawing. Nothing to install. The same sessions are available in the iOS, Android and desktop apps.</p> 1419 </details> 1420 <details class="dg-faq__item"> 1421 <summary>What timer intervals should I use for gesture drawing?</summary> 1422 <p class="ds-text ds-text--md ds-text--muted">Start with ten 30-second poses to warm up, then move to 1 or 2 minutes for the bulk of the session. Anything from 5 minutes up is closer to figure drawing than gesture drawing.</p> 1423 </details> 1424 <details class="dg-faq__item"> 1425 <summary>Does the gesture drawing timer advance automatically?</summary> 1426 <p class="ds-text ds-text--md ds-text--muted">Yes. When the interval ends the next reference image appears on its own, so you never stop to click. Tur
1426n on shuffle to see poses in random order.</p> 1427 </details> 1428 <details class="dg-faq__item"> 1429 <summary>Which devices does DrawGestures work on?</summary> 1430 <p class="ds-text ds-text--md ds-text--muted">Any modern browser, iPhone and iPad, Android phones and tablets, Windows and macOS. The app is built for tablets, with pen input and drawing on top of the reference.</p> 1431 </details> 1432 </div></div></section> 1433 1434 1435<section id="download" class="dg-cta" aria-labelledby="dg-cta-heading"> 1436 <div class="dg-cta__inner" data-reveal> 1437 <span class="ds-chip ds-chip--accent ds-chip--sm">Ready · Stop reading · Start drawing</span> 1438 <h2 class="ds-heading ds-heading--xl" id="dg-cta-heading">Ready to improve <span class="ds-heading--gradient">your gestures?</span></h2> 1439 <p class="ds-text ds-text--lg ds-text--subtle dg-cta__lede">Start a focused session in seconds â no sign-up required. Free tier ships with timed sessions, reference images and progress tracking.</p> 1440 <div class="dg-cta-row"> 1441 <a href="https://apps.apple.com/us/app/draw-gestures-figure-drawing/id1552057070" class="ds-btn ds-btn--primary ds-btn--lg" rel="noopener" target="_blank" data-cta="download_app" data-cta-location="home_footer_cta" data-cta-destination="ios" ><svg class="sk-icon sk-icon--apple" width="18" height="18" viewBox="0 0 32 38" fill="currentColor" aria-hidden="true"> 1442 <path d="M26.2264 20.0113C26.1825 15.2574 30.2187 12.9446 30.4033 12.8369C28.1174 9.5875 24.5744 9.14352 23.3293 9.10812C20.3536 8.8028 17.4672 10.8442 15.9513 10.8442C14.4052 10.8442 12.0709 9.13762 9.55512 9.18777C6.31768 9.23645 3.28902 11.064 1.62794 13.9019C-1.80011 19.6883 0.756555 28.1917 4.04089 32.8689C5.68381 35.1596 7.60358 37.7172 10.1164 37.6272C12.5747 37.5284 13.493 36.0991 16.4596 36.0991C19.399 36.0991 20.2613 37.6272 22.8241 37.5697C25.4624 37.5284 27.1235 35.2687 28.7089 32.9574C30.6075 30.3319 31.37 27.7462 31.4002 27.6135C31.3382 27.5928 26.2763 25.7092 26.2264 20.0113Z"/> 1443 <path d="M21.3854 6.03127C22.7076 4.4191 23.6122 2.22577 23.3611 0C21.4474 0.0826 19.0541 1.29063 17.6759 2.8674C16.4566 4.25685 15.3674 6.53425 15.6488 8.67595C17.7985 8.8323 20.0057 7.61837 21.3854 6.03127Z"/> 1444 </svg> 1445 App Store</a> 1446 <a href="https://play.google.com/store/apps/details?id=com.darkmat13r.gesturedrawing&amp;hl=en" class="ds-btn ds-btn--secondary ds-btn--lg" rel="noopener" target="_blank" data-cta="download_app" data-cta-location="home_footer_cta" data-cta-destination="android" ><svg class="sk-icon sk-icon--google-play" width="18" height="18" viewBox="0 0 35 38" fill="none" aria-hidden="true"> 1447 <path d="M0.700605 0.585646C0.256825 1.03921 0 1.74537 0 2.65986V35.2795C0 36.194 0.256825 36.9002 0.700605 37.3537L0.810134 37.4533L19.532 19.1817V18.7503L0.810134 0.478712L0.700605 0.585646Z" fill="url(#sk-gplay-a)"/> 1448 <path d="M25.7656 25.2753L19.532 19.1817V18.7503L25.7732 12.6567L25.9129 12.736L33.3042 16.842C35.4136 18.0072 35.4136 19.9247 33.3042 21.0974L25.9129 25.196L25.7656 25.2753Z" fill="url(#sk-gplay-b)"/> 1449 <path d="M25.9129 25.196L19.5319 18.966L0.700562 37.3537C1.40117 38.0728 2.54366 38.1594 3.8429 37.4404L25.9129 25.196Z" fill="url(#sk-gplay-c)"/> 1450 <path d="M25.9129 12.736L3.8429 0.491649C2.54366 -0.220038 1.40117 -0.133384 0.700562 0.585678L19.5319 18.966L25.9129 12.736Z" fill="url(#sk-gplay-d)"/> 1451 <defs> 1452 <linearGradient id="sk-gplay-a" x1="17.8697" y1="35.6192" x2="-6.87723" y2="10.2726" gradientUnits="userSpaceOnUse"> 1453 <stop stop-color="#00A0FF"/> 1454 <stop offset="0.0066" stop-color="#00A1FF"/> 1455 <stop offset="0.2601" stop-color="#00BEFF"/> 1456 <stop offset="0.5122" stop-color="#00D2FF"/> 1457 <stop offset="0.7604" stop-color="#00DFFF"/> 1458 <stop offset="1" stop-color="#00E3FF"/> 1459 </linearGradient> 1460 <linearGradient id="sk-gplay-b" x1="36.051" y1="18.9639" x2="-0.504247" y2="18.9639" gradientUnits="userSpaceOnUse"> 1461 <stop stop-color="#FFE000"/> 1462 <stop offset="0.4087" stop-color="#FFBD00"/> 1463 <stop offset="0.7754" stop-color="#FFA500"/> 1464 <stop offset="1" stop-color="#FF9C00"/> 1465 </linearGradient> 1466 <linearGradient id="sk-gplay-c" x1="22.4431" y1="15.5793" x2="-11.1157" y2="-18.7928" gradientUnits="userSpaceOnUse"> 1467 <stop stop-color="#FF3A44"/> 1468 <stop offset="1" stop-color="#C31162"/> 1469 </linearGradient> 1470 <linearGradient id="sk-gplay-d" x1="-4.03969" y1="48.2061" x2="10.9459" y2="32.8576" gradientUnits="userSpaceOnUse"> 1471 <stop stop-color="#32A071"/> 1472 <stop offset="0.0685" stop-color="#2DA771"/> 1473 <stop offset="0.4762" stop-color="#15CF74"/> 1474 <stop offset="0.8009" stop-color="#06E775"/> 1475 <stop offset="1" stop-color="#00F076"/> 1476 </linearGradient> 1477 </defs> 1478 </svg> 1479 Google Play</a> 1480 <a href="https://drawgestures.com/download" class="ds-btn ds-btn--ghost ds-btn--lg" data-cta="download_app" data-cta-location="home_footer_cta" data-cta-destination="download_page" >Smart download</a> 1481 </div> 1482 <p class="ds-text ds-text--sm ds-text--muted dg-cta__note">Free to start · No sign-up · iOS · Android · Tablet</p> 1483 </div> 1484</section> 1485 1486</main> 1487 1488<footer class="ds-footer"> 1489 <div class="ds-container"><div class="ds-footer__grid"> 1490 <div class="ds-footer__brand"> 1491 <p class="ds-footer__wordmark">DrawGestures</p> 1492 <p class="ds-footer__tagline">Gesture drawing practice for artists â timed figure drawing sessions on iOS and Android.</p> 1493 <div class="ds-footer__socials"> 1494 <a href="https://www.instagram.com/drawgestures/" rel="noopener me" target="_blank" aria-label="DrawGestures on Instagram" title="Instagram"> 1495 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.5" cy="6.5" r="1" fill="currentColor" stroke="none"/></svg> 1496 </a> 1497 <a href="https://x.com/drawgestures" rel="noopener me" target="_blank" aria-label="DrawGestures on X" title="X"> 1498 <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M17.53 3h3.02l-6.6 7.54L21.75 21h-5.9l-4.62-6.03L5.94 21H2.92l7.06-8.07L2.5 3h6.05l4.18 5.52L17.53 3Zm-1.06 16.2h1.67L7.6 4.71H5.81L16.47 19.2Z"/></svg> 1499 </a> 1500 </div> 1501 </div> 1502 1503 <div> 1504 <p class="ds-footer__heading">Explore</p> 1505 <ul class="ds-footer__links"> 1506 <li><a href="https://drawgestures.com/about">About</a></li> 1507 <li><a href="https://drawgestures.com/guides">Guides</a></li> 1508 <li><a href="https://drawgestures.com/pricing">Pricing</a></li> 1509 <li><a href="https://drawgestures.com/challenge">Challenge</a></li> 1510 </ul> 1511 </div> 1512 1513 <div> 1514 <p class="ds-footer__heading">Legal & Help</p> 1515 <ul class="ds-footer__links"> 1516 <li><a href="https://drawgestures.com/privacy">Privacy Policy</a></li> 1517 <li><a href="https://drawgestures.com/terms">Terms of Service</a></li> 1518 <li><a href="https://drawgestures.com/refund">Refund Policy</a></li> 1519 <li><a href="https://drawgestures.com/support">Support</a></li> 1520 </ul> 1521 </div> 1522 1523 <div> 1524 <p class="ds-footer__heading">Get the App</p> 1525 <div class="ds-footer__badges"> 1526 <a href="https://apps.apple.com/us/app/draw-gestures-figure-drawing/id1552057070" rel="noopener" target="_blank" aria-label="Download on the App Store"> 1527 <img src="https://drawgestures.com/images/app-store-badge.png" alt="Download on the App Store" loading="lazy"> 1528 </a> 1529 <a href="https://play.google.com/store/apps/details?id=com.darkmat13r.gesturedrawing" rel="noopener" target="_blank" aria-label="Get it on Google Play"> 1530 <img src="https://drawgestures.com/images/google-play-badge.png" alt="Get it on Google Play" loading="lazy"> 1531 </a> 1532 </div> 1533 </div> 1534 </div> 1535 1536 <div class="ds-footer__bottom">
1537 <p class="ds-footer__copyright">© 2026 Dark Matter. All rights reserved.</p> 1538 <p class="ds-footer__copyright">Made for artists, by artists.</p> 1539 </div></div> 1540</footer> 1541
1542<script> 1543(function () { 1544 if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return; 1545 if (!('IntersectionObserver' in window)) return; 1546 1547 document.documentElement.classList.add('dg-js'); 1548 1549 var revealed = document.querySelectorAll('[data-reveal]'); 1550 var io = new IntersectionObserver(function (entries) { 1551 entries.forEach(function (entry) { 1552 if (!entry.isIntersecting) return; 1553 var el = entry.target; 1554 el.style.setProperty('--reveal-delay', (el.getAttribute('data-reveal-delay') || 0) + 'ms'); 1555 el.classList.add('is-in'); 1556 io.unobserve(el); 1557 }); 1558 }, { threshold: 0.15 }); 1559 revealed.forEach(function (el) { io.observe(el); }); 1560 1561 var num = document.getElementById('dg-rating-num'); 1562 var count = document.getElementById('dg-rating-count'); 1563 var host = document.getElementById('reviews'); 1564 if (!num || !host) return; 1565 var counted = false; 1566 var ioCount = new IntersectionObserver(function (entries) { 1567 if (counted || !entries.some(function (e) { return e.isIntersecting; })) return; 1568 counted = true; 1569 ioCount.disconnect(); 1570 var t0 = performance.now(), dur = 1400; 1571 var tick = function (t) { 1572 var p = Math.min(1, (t - t0) / dur); 1573 var eased = 1 - Math.pow(1 - p, 3); 1574 num.textContent = (4.6 * eased).toFixed(1); 1575 if (count) count.textContent = p < 1 ? Math.round(2100 * eased).toLocaleString() : '2,100+'; 1576 if (p < 1) requestAnimationFrame(tick); 1577 }; 1578 requestAnimationFrame(tick); 1579 }, { threshold: 0.3 }); 1580 ioCount.observe(host); 1581})(); 1582</script>
1582 1583</body> 1584</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.