1<!DOCTYPE html> 2<html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <title>ASCII Art Generator</title> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <meta name="application-name" content="TextArt.io" /> 8 <meta name="google-site-verification" content="4zxnsw6HrjtN7J7SFsW51GL4TAHFbjFxWhy4MnVJaYk" /> 9 <meta name="msvalidate.01" content="862295C6F21EB0467870986498893633" /> 10 <meta name="author" content="orthosie" /> 11 <meta name="robots" content="All" /> 12 <meta name="description" content="Generate ascii art from an image. Upload your photos or images and get an equivalent ascii art in color or monochrome."> 13 <meta name="keywords" content="" /> 14 <meta name="generator" content="Orthosie META Tag Generator: http://toolswebtop.com/seo/metatag" /> 15 <meta name="rating" content="General" /> 16 17 <meta name="dcterms.title" content="ASCII Art Generator" /> 18 <meta name="dcterms.contributor" content="orthosie" /> 19 <meta name="dcterms.creator" content="orthosie" /> 20 <meta name="dcterms.publisher" content="orthosie" /> 21 <meta name="dcterms.description" content="Generate ascii art from an image. Upload your photos or images and get an equivalent ascii art in color or monochrome." /> 22 <meta name="dcterms.rights" content="Copyright 2014-16 ASCII.gallery" /> 23 24 <meta property="og:type" content="website" /> 25 <meta property="og:title" content="ASCII Art Generator" /> 26 <meta property="og:site_name" content="ASCII.gallery" /> 27 <meta property="og:description" content="Generate ascii art from an image. Upload your photos or images and get an equivalent ascii art in color or monochrome." /> 28 <meta property="twitter:title" content="ASCII Art Generator" /> 29 <meta property="twitter:description" content="Generate ascii art from an image. Upload your photos or images and get an equivalent ascii art in color or monochrome." /> 30 31 <link type="image/x-icon" href="/favicon.ico" rel="shortcut icon"/> 32 33 <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 34 <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 35 36
36<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
36 37
37<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
37 38 <!-- Latest compiled and minified JavaScript --> 39 <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"> 40 41 <!-- HTML5 shim, for IE6-8 support of HTML5 elements --> 42 <!--[if lt IE 9]> 43
43<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
43 44 <![endif]--> 45 <link href='//fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'> 46 47<style> 48 body { 49 font-family: 'Roboto', sans-serif; 50 font-size: 20px; 51 } 52 53.head-room { 54 margin-top: 15px; 55} 56 57.leg-room { 58 margin-bottom: 15px; 59} 60 61.top-ad { 62 background-color: #111; 63 width: 100%; 64 background-image: url("/img/bg.png"); 65} 66 67 .pre-art { 68 margin: 0; 69 padding-left: 20px; 70 padding-top: 40px; 71 padding-bottom: 40px; 72 } 73 74 75.bggreenshade { 76 padding-top: 20px; 77 background-color: #f8f8f8; 78 padding-bottom: 20px; 79} 80 81.navbar { 82 border-radius: 0px; 83 -moz-border-radius: 0px; 84 -webkit-border-radius: 0px; 85} 86 87.navbar-brand, 88.navbar-nav li a { 89 line-height: 70px; 90 height: 70px; 91 padding-top: 0; 92} 93 94 ul.dropdown-menu 95 { 96 z-index: 999; 97 } 98 99#custom-bootstrap-menu.navbar-inverse .navbar-brand { 100 color: rgba(119, 119, 119, 1); 101} 102#custom-bootstrap-menu.navbar-inverse { 103 font-size: 14px; 104 background-color: rgba(248, 248, 248, 1); 105 border-width: 1px; 106} 107#custom-bootstrap-menu.navbar-inverse .navbar-nav>li>a { 108 color: rgba(255, 255, 255, 1); 109 background-color: rgba(248, 248, 248, 0); 110} 111.dropdown-menu li a:hover, 112#custom-bootstrap-menu.navbar-inverse .navbar-nav li a:hover, 113#custom-bootstrap-menu.navbar-inverse .navbar-nav>li>a:focus { 114 color: rgba(51, 51, 51, 1); 115 background-color: #33cc99; 116} 117 118 119#custom-bootstrap-menu.navbar-inverse .navbar-nav>.active>a, 120#custom-bootstrap-menu.navbar-inverse .navbar-nav>.active>a:hover, 121#custom-bootstrap-menu.navbar-inverse .navbar-nav>.active>a:focus { 122 color: rgba(85, 85, 85, 1); 123 background-color: #33cc99; 124} 125#custom-bootstrap-menu.navbar-inverse .navbar-toggle { 126 border-color: #33cc99; 127 padding-top: 20px; 128 padding-bottom: 20px; 129} 130#custom-bootstrap-menu.navbar-inverse .navbar-toggle:hover, 131#custom-bootstrap-menu.navbar-inverse .navbar-toggle:focus { 132 /*background-color: #33cc99;*/ 133} 134#custom-bootstrap-menu.navbar-inverse .navbar-toggle .icon-bar { 135 background-color: #33cc99; 136} 137#custom-bootstrap-menu.navbar-inverse .navbar-toggle:hover .icon-bar, 138#custom-bootstrap-menu.navbar-inverse .navbar-toggle:focus .icon-bar { 139 background-color: #33cc99; 140} 141 142canvas { 143 display: block; 144} 145 146.navbar { 147 margin-bottom: 0px; 148} 149 150 .title { 151 background-color: #33cc99; 152 padding-top: 20px; 153 padding-bottom: 20px; 154 color: #fff; 155 font-weight: bold; 156 padding-left: 2%; 157 margin:0; 158 } 159 160 footer { 161 margin-top: 0px; 162 padding: 0; 163 padding-top: 40px;
164 border-top: 4px solid #000; 165 background-color: #33cc99; 166 } 167 168 footer ul li a , 169 footer ul li a:hover , 170 footer ul li a:visited { 171 color: #fff; 172 text-decoration: none; 173 } 174 footer ul, footer li{ 175 list-style:none; 176 list-style-type:none; 177 list-style-position: inside; 178 padding:0;margin:0; 179 padding-left: 0; 180 margin-left: 0; 181 line-height:30px 182 } 183 184 .footer-links { 185 padding-bottom: 60px; 186 } 187.bottom-copyright { 188 width: 100%; 189 padding-top: 15px; 190 padding-bottom: 15px; 191 text-align: center; 192 background-color: #33dd99; 193} 194 .high-light { 195 color: #33cc99; 196 } 197 198ul.tags { 199 margin-top:20px; 200 margin-bottom:-10px; 201 margin-left:-10px; 202} 203 204.tags{ 205 margin-right:10px; 206 padding:0; 207 list-style:none; 208 margin-bottom: 25px; 209 font-family: 'Serif'; 210 font-size: 12px; 211} 212 213.tags li, .tags a{ 214 float:left; 215 height:24px; 216 line-height:24px; 217 position:relative; 218 font-size:12px; 219 margin-bottom: 15px; 220 } 221.tags a{ 222 margin-left:20px; 223 padding:0 10px 0 12px; 224 /*background:#0089e0;*/ 225 /*background: #9fcc25;*/ 226 background: #33cc99; 227 color:#fff; 228 text-decoration:none; 229 -moz-border-radius-bottomright:4px; 230 -webkit-border-bottom-right-radius:4px; 231 border-bottom-right-radius:4px; 232 -moz-border-radius-topright:4px; 233 -webkit-border-top-right-radius:4px; 234 border-top-right-radius:4px; 235 } 236 237.tags a:before{ 238 content:""; 239 float:left; 240 position:absolute; 241 top:0; 242 left:-12px; 243 width:0; 244 height:0; 245 /*border-color:transparent #0089e0 transparent transparent;*/ 246 /*border-color:transparent #9fcc25 transparent transparent;*/ 247 border-color:transparent #33cc99 transparent transparent; 248 border-style:solid; 249 border-width:12px 12px 12px 0; 250 } 251.tags a:after{ 252 content:""; 253 position:absolute; 254 top:10px; 255 left:0; 256 float:left; 257 width:4px; 258 height:4px; 259 -moz-border-radius:2px; 260 -webkit-border-radius:2px; 261 border-radius:2px; 262 background:#fff; 263 -moz-box-shadow:-1px -1px 2px #004977; 264 -webkit-box-shadow:-1px -1px 2px #004977; 265 box-shadow:-1px -1px 2px #004977; 266 } 267.tags a:hover{background: #0089e0} 268 269.tags a:hover:before{border-color:transparent #0089e0 transparent transparent;} 270 271.box { 272 border: 1px solid #d4d4d4; 273} 274 275.pre { 276 background-color: #fff; 277 border: 1px solid #d4d4d4; 278 border-radius: 2px; 279 -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); 280 box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); 281 max-height: 100%; 282} 283 284.pre-x-scrollable{background-color:#fefefe;background-color: rgb(254,254,254,0.8);overflow-x:auto;word-wrap:normal;white-space:pre;max-width:100%} 285 286 .pre-art { 287 background-color: #000; 288 color: #00cc00; 289 } 290 291 292.ascii-wrapper { 293 position: relative; 294 width: 100%; 295 min-height: 50px; 296 margin: 0; 297} 298 299 300.ascii-homebrew { 301 background-color: #000; 302 color: #00cc00; 303} 304 305.ascii-dark { 306 background-color: #000; 307 color: #fff; 308} 309 310.ascii-light { 311 background-color: #fff; 312 color: #000; 313} 314 315.ascii-controls { display: none; } 316.ascii-wrapper:hover .ascii-controls{ display: block; } 317.ascii-wrapper:not(:hover) .ascii-controls{ display: none; } 318 319.colorschemes { 320 position:absolute; 321 top:0px;right:0px; 322 width:150px;height:80px;padding:5px; 323 text-align:center; 324 background-color:#eee; 325 color: #000; 326 background-color: rgba(255,255,255,0.6); 327 z-index:999 328} 329 330.colorschemes .colorbox { 331 display:inline-block; 332 margin-top:5px; 333 width:40px;height:40px;text-align:center;padding:5px;cursor:pointer; 334 border: 1px solid #fefefe; 335 font-size: 18px; 336 margin-bottom: 5px; 337} 338 339#homebrew{background-color:#000;color:#0c0} 340#dark{background-color:#000;color:#fff} 341#light{background-color:#fff;color:#000 } 342 343 344 345.yamm .nav, 346.yamm .collapse, 347.yamm .dropup, 348.yamm .dropdown { 349 position: static; 350} 351.yamm .container { 352 position: relative; 353} 354.yamm .dropdown-menu { 355 left: auto; 356} 357.yamm .yamm-content { 358 padding: 20px 30px; 359} 360.yamm .dropdown.yamm-fw .dropdown-menu { 361 left: 0; 362 right: 0; 363} 364 365.dropdown-submenu{ 366 position:relative; 367 z-index: 102; 368} 369.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;} 370.dropdown-submenu:hover>.dropdown-menu{display:block;} 371.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;} 372.dropdown-submenu:hover>a:after{border-left-color:#ffffff;} 373.dropdown-submenu.pull-left{float:none;} 374.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;} 375 376</style> 377
378<script> 379function set_homebrew_scheme(elementid) { 380 var element = document.getElementById(elementid); 381 element.className += " ascii-homebrew"; 382 element.className = element.className.replace( /(?:^|\s)ascii-dark(?!\S)/g , '' ); 383 element.className = element.className.replace( /(?:^|\s)ascii-light(?!\S)/g , '' ); 384} 385 386function set_dark_scheme(elementid) { 387 var element = document.getElementById(elementid); 388 element.className += " ascii-dark"; 389 element.className = element.className.replace( /(?:^|\s)ascii-homebrew(?!\S)/g , '' ); 390 element.className = element.className.replace( /(?:^|\s)ascii-light(?!\S)/g , '' ); 391} 392 393function set_light_scheme(elementid) { 394 var element = document.getElementById(elementid); 395 element.className += " ascii-light"; 396 element.className = element.className.replace( /(?:^|\s)ascii-dark(?!\S)/g , '' ); 397 element.className = element.className.replace( /(?:^|\s)ascii-homebrew(?!\S)/g , '' ); 398} 399</script>
vendor: 1 bytes, line 399
399
400<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
vendor: 1 bytes, line 400
400
401<script> 402 (adsbygoogle = window.adsbygoogle || []).push({ 403 google_ad_client: "ca-pub-4658013134207481", 404 enable_page_level_ads: true 405 }); 406</script>
406 407<style> 408 .pre-art { 409 margin: 0; 410 padding-left: 20px; 411 padding-top: 40px; 412 padding-bottom: 40px; 413 } 414</style> 415
415<script src="/js/colorscheme.js"></script>
415 416</head> 417<body> 418<div class="top-ad text-center"> 419
419<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
419 420 <!-- ascii.gallery responsive --> 421 <ins class="adsbygoogle" 422 style="display:block" 423 data-ad-client="ca-pub-4658013134207481" 424 data-ad-slot="7423734203" 425 data-ad-format="auto"></ins> 426
426<script> 427 (adsbygoogle = window.adsbygoogle || []).push({}); 428 </script>
428 429</div> 430<nav id="custom-bootstrap-menu" class="navbar yamm navbar-inverse navbar-static-top" role="navigation"> 431 <!-- Brand and toggle get grouped for better mobile display --> 432 <div class="navbar-header"> 433 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 434 <span class="sr-only">Toggle navigation</span> 435 <span class="icon-bar"></span> 436 <span class="icon-bar"></span> 437 <span class="icon-bar"></span> 438 </button> 439 <a class="navbar-brand" href="/#"><span class="high-light">{ TEXTART.io }</span></a> 440 </div> 441 442 <!-- Collect the nav links, forms, and other content for toggling --> 443 <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 444 <ul class="nav navbar-nav"> 445 <li class="dropdown "> 446 <a href="#" data-toggle="dropdown" class="dropdown-toggle" data-title="Create"> Create <b class="caret"></b></a> 447 <ul class="dropdown-menu"> 448 <li tabindex="-1" ><a href="/figlet#" data-title="ASCII.figlet"> ASCII.figlet </a></li> 449 <li tabindex="-1" class="active"><a href="/image#" data-title="ASCII.image"> ASCII.image </a></li> 450 <li tabindex="-1" ><a href="/matheq#" data-title="ASCII.math"> ASCII.math </a></li> 451 <li tabindex="-1" ><a href="/table#" data-title="ASCII.table"> ASCII.table </a></li> 452 <li tabindex="-1" ><a href="/cowsay#" data-title="Cow.says"> Cow.says </a></li> 453 <li tabindex="-1" ><a href="/sequence#" data-title="ASCII.sequence"> ASCII.sequence</a></li> 454 </ul> 455 </li> 456 <li class="dropdown "> 457 <a href="#" data-toggle="dropdown" class="dropdown-toggle" data-title="Consume"> Consume <b class="caret"></b></a> 458 <ul class="dropdown-menu"> 459 <li tabindex="-1" ><a href="/art#" data-title="ASCII.art"> ASCII.art </a></li> 460 </ul> 461 </li> 462 <li class="dropdown "> 463 <a href="#" data-toggle="dropdown" class="dropdown-toggle" data-title="Have Fun"> Have Fun <b class="caret"></b></a> 464 <ul class="dropdown-menu"> 465 <li tabindex="-1" ><a href="/webcam#" data-title="ASCII.webcam"> ASCII.webcam</a></li> 466 </ul> 467 </li> 468 <li class="dropdown "> 469 <a href="#" data-toggle="dropdown" class="dropdown-toggle" data-title="api"> API <b class="caret"></b></a> 470 <ul class="dropdown-menu"> 471 <li tabindex="-1" ><a href="/api/figlet#" data-title="Figlet API"> Figlet API</a></li> 472 <li tabindex="-1" ><a href="/api/cowsay#" data-title="Cowsay API"> Cowsay API</a></li> 473 <li tabindex="-1" ><a href="/api/img2txt#" data-title="Image to Text API"> Image to Text Art API</a></li> 474 </ul> 475 </li> 476 <li class="dropdown"> 477 <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-hand-right"></span> About <b class="caret"></b></a> 478 <ul class="dropdown-menu"> 479 <li><a href="/terms#" title="Terms of use"> <span class="glyphicon glyphicon-tasks"></span> Terms of use</a></li> 480 <li><a href="/privacy#" title="Privacy Policy"> <span class="glyphicon glyphicon-tasks"></span> Privacy Policy</a></li> 481 <li><a href="/contactus#" title="Contact us"> <span class="glyphicon glyphicon-envelope"></span> Contact us</a></li> 482 </ul> 483 </li> 484 </ul> 485 <ul class="nav navbar-nav navbar-right"> 486 <li class="dropdown "> 487 <a href="#" data-toggle="dropdown" class="dropdown-toggle" data-title="Search"><span class="glyphicon glyphicon-search"></span><b class="caret"></b></a> 488 <ul class="dropdown-menu "> 489 <li> 490 <div class="yamm-content"> 491 <div class="row"> 492 <div class="col-sm-12"> 493 <form class="form form-horizontal" action="/search" role="search"> 494 <div class="input-group"> 495 <input type="text" class="search-query form-control input-lg" placeholder="Search TextArt.io..." name="q" value="" id="q"/> 496 <div class="input-group-btn"> 497 <button class="btn btn-lg btn-success" type="submit" >Search</button> 498 </div> 499 </div> 500 </form> 501 </div> 502 </div> 503 </div> 504 </li> 505 </ul> 506 </li> 507 <li class="dropdown "> 508 <a href="#" data-toggle="dropdown" class="dropdown-toggle" data-title="Search"><span class="glyphicon glyphicon-user"></span><b class="caret"></b></a> 509 <ul class="dropdown-menu "> 510 <li><a href="/login#" title="Login"> <span class="glyphicon glyphicon-log-in"></span> Login</a></li> 511 <li><a href="/register#" title="Register"> <span class="glyphicon glyphicon-edit"></span> Register</a></li> 512 </ul> 513 </li> 514 </ul> 515 </div><!-- /.navbar-collapse --> 516</nav> 517<div class="title leg-room"> 518 <h1>ASCII Art Generator</h1> 519</div> 520<div id="result" class="ascii-wrapper"> 521</div> 522<div class="container-fluid">
523 <div class="row head-room"> 524 <div class="col-sm-7 col-md-7 col-lg-7 col-xs-12"> 525 <p class="text-muted">Generate an ASCII art from a photo or an image. Works from your browser on desktop or mobile. If you like this service you might be interested in our <a href="/figlet" title="ASCII text generator">ASCII text generator</a> service as well which converts your text into an ascii art.</p> 526 <form id="ascii" role="form" method="post" enctype="multipart/form-data"> 527 <p><strong>Select whether you want monochrome or color ascii art</strong></p> 528 <div class="radio-inline"> 529 <label> 530 <input type="radio" class="form-control" id="atype" name="type" value="mono">Mono 531 </label> 532 </div> 533 <div class="radio-inline"> 534 <label> 535 <input type="radio" class="form-control" name="type" value="color" checked>Color 536 </label> 537 </div> 538 <p class="head-room"><strong>Specify the image file to convert to ascii art</strong></p> 539 <div class="tabpane"> 540 <ul class="nav nav-tabs"> 541 <li class="active"><a href="#upload" data-toggle="tab">From your computer</a></li> 542 <li><a href="#url" data-toggle="tab">From Web</a></li> 543 </ul> 544 <div class="tab-content"> 545 <div class="tab-pane active" id="upload"> 546 <div class="form-group elbow-room"> 547 <label for="tfile">Select an image to upload</label> 548 <input type="file" name="image" id="tfile" /> 549 </div> 550 </div> 551 <div class="tab-pane" id="url"> 552 <div class="form-group"> 553 <label for="url_box" class="control-label">URL of the image</label> 554 <input class="form-control" id="url_box" name="url" size="50" placeholder="Enter URL here"/> 555 </div> 556 </div> 557 </div> 558 </div> 559 <div class="text-center head-room leg-room"> 560 <button class="btn btn-lg btn-success" name="reset" type="reset">Clear</button> 561 <button class="btn btn-lg btn-primary" name="submit" type="submit">Generate</button> 562 </div> 563 </form> 564 </div> 565 <div class="col-sm-5 col-md-5 col-lg-5 col-xs-12">
566<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
566 567<!-- textart.io 336x280 --> 568<ins class="adsbygoogle" 569 style="display:inline-block;width:336px;height:280px" 570 data-ad-client="ca-pub-4658013134207481" 571 data-ad-slot="2893311805"></ins>
572<script> 573(adsbygoogle = window.adsbygoogle || []).push({}); 574</script>
574 575 </div> 576 </div> 577</div> 578<div class="text-center head-room bggreenshade"> 579 <h4 class="text-muted">Advertisement</h4> 580
580<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
580 581 <!-- ascii.gallery responsive --> 582 <ins class="adsbygoogle" 583 style="display:block" 584 data-ad-client="ca-pub-4658013134207481" 585 data-ad-slot="7423734203" 586 data-ad-format="auto"></ins> 587
587<script> 588 (adsbygoogle = window.adsbygoogle || []).push({}); 589 </script>
589 590</div> 591<div class="container-fluid"> 592 <div class="text-center head-room"> 593 <div id="disqus_thread"></div> 594
594<script> 595 (function() { // DON'T EDIT BELOW THIS LINE 596 var d = document, s = d.createElement('script'); 597 598 s.src = '//textart.disqus.com/embed.js'; 599 600 s.setAttribute('data-timestamp', +new Date()); 601 (d.head || d.body).appendChild(s); 602 })(); 603 </script>
603 604 <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript> 605 606 </div> 607</div> <!--container--> 608 609<footer> 610 <div class="container footer-links"> 611 <div class="row"> 612 <div class="col-sm-4 col-md-4 col-lg-4 col-xs-12"> 613 <h4>Tools</h4> 614 <ul> 615 <li><a href="/figlet#" title="Figlet Generator">Figlet Generator</a></li> 616 <li><a href="/cowsay#" title="Cowsay">Cowsay</a></li> 617 </ul> 618 </div> 619 <div class="col-sm-4 col-md-4 col-lg-4 col-xs-12"> 620 <h4>API</h4> 621 <ul> 622 <li><a href="/api/figlet#" title="Figlet Text Art API">FIGlet API</a></li> 623 <li><a href="/api/cowsay#" title="Cowsay Text Art API">Cowsay API</a></li> 624 <li><a href="/api/img2txt#" title="Image to Text Art API">Image to Text art API</a></li> 625 </ul> 626 </div> 627 <div class="col-sm-4 col-md-4 col-lg-4 col-xs-12"> 628 <h4>About</h4> 629 <ul> 630 <li><a href="/terms#" title="Terms of use">Terms of use</a></li> 631 <li><a href="/privacy#" title="Terms of use">Privacy</a></li> 632 </ul> 633 </div> 634 </div><!--/row--> 635 </div> 636 <div class="bottom-copyright"> 637 <p class="text-center"><small>Copyright © 2016-2018 - <a href="/#" title="TextArt.io">TextArt.io</a> - All rights reserved.</small></p> 638 </div><!--/row--> 639</footer> 640<div class="matrix"> 641 <canvas id="c"></canvas> 642</div> 643
644<script>
vendor: 339 bytes, lines 644-650
644 645 (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ 646 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), 647 m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) 648 })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); 649 650 ga('create', '
650UA-70777850-1
vendor: 39 bytes, lines 650-652
650', 'auto'); 651 ga('send', 'pageview'); 652
653</script>
vendor: 1 bytes, line 653
653
654<script> 655var c = document.getElementById("c"); 656var ctx = c.getContext("2d"); 657 658//making the canvas full screen 659//c.height = window.innerHeight; 660//var width = (screen.width > 0) ? screen.width : window.innerWidth; 661var width = (window.innerWidth > 0) ? window.innerWidth : screen.width; 662c.height = 150; 663c.width = width; 664 665 666//unicode characters - taken from the unicode charset 667var unicode = "TextArt.io"; 668//converting the string into an array of single characters 669unicode = unicode.split(""); 670 671var font_size = 16; 672var columns = c.width/font_size; //number of columns for the rain 673//an array of drops - one per column 674var drops = []; 675//x below is the x coordinate 676//1 = y co-ordinate of the drop(same for every drop initially) 677for(var x = 0; x < columns; x++) 678 drops[x] = 1; 679 680//drawing the characters 681function draw() 682{ 683 //Black BG for the canvas 684 //translucent BG to show trail 685 ctx.fillStyle = "rgba(0, 0, 0, 0.05)"; 686 ctx.fillRect(0, 0, c.width, c.height); 687 688 ctx.fillStyle = "#0F0"; //green text 689 ctx.font = font_size + "px arial"; 690 //looping over drops 691 for(var i = 0; i < drops.length; i++) 692 { 693 //a random unicode character to print 694 var text = unicode[Math.floor(Math.random()*unicode.length)]; 695 //x = i*font_size, y = value of drops[i]*font_size 696 ctx.fillText(text, i*font_size, drops[i]*font_size); 697 698 //sending the drop back to the top randomly after it has crossed the screen 699 //adding a randomness to the reset to make the drops scattered on the Y axis 700 if(drops[i]*font_size > c.height && Math.random() > 0.975) 701 drops[i] = 0; 702 703 //incrementing Y coordinate 704 drops[i]++; 705 } 706} 707 708setInterval(draw, 33); 709</script>
709 710<link rel="stylesheet" type="text/css" href="/css/cookieconsent.min.css" />
711<script src="/js/cookieconsent.min.js"></script>
vendor: 1 bytes, line 711
711
712<script> 713window.addEventListener("load", function(){ 714window.cookieconsent.initialise({ 715 "palette": { 716 "popup": { 717 "background": "#000" 718 }, 719 "button": { 720 "background": "#f1d600" 721 } 722 }, 723 "showLink": false 724})}); 725</script>
725 726 727</body> 728</html> 729
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.