Real-Time ASCII Art Rendering

Transform an input image/frame (human faces included) into printable ASCII characters using a single decision tree.

N. Markus, M. Fratarcangeli, I. S. Pandzic and J. Ahlberg, "Fast Rendering of Image Mosaics and ASCII Art", Computer Graphics Forum, 2015, <dx.doi.org/10.1111/cgf.12597>


This demo is tied to the SOD project: An Embedded Computer Vision & Machine Learning Library - sod.pixlab.io.


Select an image to upload

Input Image

Automatically resized to fit this column

Output ASCII Glyphs

Download full resolution PNG

Output ASCII Text

Fetch as plain text file

````````````````````````````.)-`````````````````
```````````````````````\)`:-)~,`.```````````````
```````````````.....,->^'_\^\/.>'```````````````
```````````````..,-;-~~<\)~,```````````````
```````````````..;"~~~"~-|;>>~>\|```````````````
```````````````.~:::::":-:::~-^~)_,`````````````
```````````````~::::::::::::~~:-^((`````````````
`````````````<((::::::::::::::~:(;(',.``````````
`````````...`|(;::::':::::::::::-~^;/..`````````
`````````...(--:::;;':::::::,::::~|\,..`````````
`````````..;~:::jaMFgawwwqagdgu/:~~~~..`````````
`````````..;:~:jFMFM4ggd4W4FDM&M_::~/..`````````
`````````.`;:::dFW2QbWgZgMFFFQbd4;:~"..`````````
`````````.`~::jFFFbbFdZg&M&4QM&QQ1::~..`````````
`````````.`;::dF4AWWgggZ&FM464bdg&:::..`````````
`````````..:::dM24WQWdZZ552&&MWQgZ:_|..`````````
`````````..:::QgW4WgdgMMM5WFMWdMQ$:_'..`````````
`````````..":_QF!??*MgggMF$M7!?!Q$:~...`````````
`````````..::vMdF4wu__MMMP__jaMQd$:`,..`````````
`````````.w1:?MFTT^7TTQgQPTT??7XZ$:,p_.`````````
`````````.w4:vZb#[~?dLdZMp%s|>#!ZM:_4l.`````````
`````````.Um`_MMdFjjFygMM&yM_jFdZF'?dL.`````````
`````````.T*[_5MMF&4ddQddQgdgbMQZ4;jbI.`````````
`````````.7LFd5MF4M&bQQZFMdF2bMQZ$LLP'.`````````
`````````..T*T$gFMFMFMdZdQFFMb2gZFU*]..`````````
`````````...5jdg&F&MQFddgFFFbF2dZ&a[...`````````
````````````YFdggFMWbd*QM&&44&bd$4F'````````````
````````````~ITgF&bQFMyyydgQW4MQF[^`````````````
``````````````VgMF4FFdQFFWgFFdgg*~``````````````
``````````````~MgggbdQQMMdFMbdQ4*```````````````
```````````````TdMggPT***PTd&dMD(```````````````
```````````````.TgMgMMM*MM$WddF[.```````````````
```````````````.>MggMdMadMMbMFP'.```````````````
```````````````..?MgggggggggFK'..```````````````
```````````````..,?T$ggggggM*:...```````````````
```````````````..""LT*gWgFTLz:...```````````````
```````````````..;,tyywTywyyI:...```````````````
```````````````..~::~7yyyyp!,;",.```````````````
```..........,.;;::;:~?gg!,:;:'~-;,,.........```
```.......,.,-~;;:::;-:t$;::::,:~;~-;.,......```
```.....-;-~:::-:;,:;;;JR;;:::::::::~"::.....```
```...;-~:::::::-~;;;`:TQ~:',::::::::::~-:;..```
```./~:::::::::~:~;;;;',:;;;;;::::::::;;;/~;.```
```-;;;;;:::::::/~;;;;;;;;;;;;:::::~::-;;:;;.```
````;;:;;::::::-:~~~;;;;;;;";;::::::::;;;,;".```
```/;;~;;::::::-:~~~;;;;;;;";;::::::::;;;';;/```
```:;;:;;::::::-:~~~;;;;;;;";;::::::::;;;";;;```

Ribery
Ribery ASCII
`````````````````````,-./,.`````````````````````
``````````````````,.''',,',;.,``````````````````
`````````````````,:>/_-<\;(^`,``````````````````
```````````````.v_Xvk!=!+"(_,(:,.```````````````
``````````````.\_~/^>_++V?{nji_~(,``````````````
`````````````,;^Y>!ivtjw*ouj!Tw_-,``````````````
``````````````)_jj7tYj*%JfJ%ygg[_-.`````````````
`````````````-;dg$w77U177V!7dEEgL__`````````````
```````````.,_=5d$Ln77?7[{??7M&@&l+;````````````
`````````..,_jI5M7]I!v}?il!+Jw$MP[__...`````````
`````````.._vVJ6L7zVrjjj==YunuTQP={^...`````````
`````````..>}?nTTzIjwj]U[*j[Y7wdL1l(...`````````
`````````.._!=!j[j7]77fL7=Vf?!C*[Ij\(..`````````
`````````.`?_?V7TL7I!=7rnOjfjo*T[{!_;..`````````
`````````.`^}vvT*AtLjjjwLsyJ%k7L[l^_(..`````````
`````````.`v!?vT*TqwTdgM*4yg&UTyu!(^+..`````````
`````````.`)_+{?!^??***TTTaMTLhToo+)(..`````````
`````````.`_v+^`,``~`-?%H*t7?77VhT[)l..`````````
`````````w_x++"---_;.__nTn~~'`~~?q[^!e*`````````
````````_?]7>v_|-^??!_)?T[_/'-.->V[_y[j`````````
````````[vYv+_==;l-v*T_Yq[7_x,|`_fLvTzj`````````
````````Lju?_!]7IITkT[\jA[7T[PLr7Tpv?wI`````````
````````~V_7wLbNp7jjU$My7TyMA9Tt79L.`````````
`````````-*!\|?o4PAp[*LbgFML?7MTLIjwdl.`````````
`````````vLj)(?J*qU7v+?TT*77O_7O7n77T```````````
``````````7r^v?J7*[l_-,~^^_?Vu?7vjl`````````````
````````````"?Vlvwk!+-;,;_+)??kYnVI`````````````
`````````````+VIj\^~_jjwUwn=__?}J1(`````````````
`````````````~!Iwjz-~\?7?^^~'+ujY7'`````````````
`````````````">!IjL_,liay*b[>wwfI{``````````````
``````````````(+?qAL\TfZM#P_vbLL?)``````````````
``````````````>>-!TL[+uMa2[+jTk!ii``````````````
``````````````/__~]Tk^*ULj!jU*ilvz``````````````
``````````````_>i;??j!j??_j7*{+!JI``````````````
``````````````_i!_>vwx_^+^vw%J_+jI``````````````
``````````````li__/l7mLl_yypk{?jp[;`````````````
`````````...._uI_()-[TTMTMTgn+?ohh>,.........```
`````````.,yM?=Y}_/~~]TDTT7ux_fwLwxTyj,......```
````````_=LE7?IVu{_;;^kpPO??(YqTU*[TRE[*/....```
``````j*G@@~f?jjjIx_;,~^?^~_Iw*K*wvY#~~gTaj,.```
```_uTyg*(^~1>IYY=ji_;:,,;vjjLTTkw_4~F_7MgT*w;``
`_=La#F?ygggA~II!jtjj___jjwwyyp%%!(N~gggyj9#yT*j
yg##*?y##7?#M_>1?YwwwyyyyqymP*TL*/ja@*77#~gI9#gy
M7?jyg#!;\_T&q~YljJppygdMgaW&pLq!~L@F+~-_T#~aj7T
ag@@F7~"-/+V@M[~VjjqdMFWgMFg&pT!~dyE[/_v!}+7Q@@g

Harrison
Harrison ASCII
````````'/''.,>?t[I_;````````````````````````
````````/,'`,,>v77[[?;```````````````````````
```````-,,,,,`>_?J7Ljj```````````````````````
````````;:'/:,/v+?ITyn....```````````````````
```````,::,:/:/^vxvJTm_...```````````````````
```````:::;```-^_v=jjLT...```````````````````
```````(-:',,'~/^+?7LLk(..```````````````````
```````;:',`,://_jur***_____:,```````````````
```..::_:,\,,_juwr?7!njV=?^~~_```````````````
```....^`;_u%TULL=__?+^~',,:/"```````````````
```.|+=rTs7==!?+^~~_v_i:.`\:`````````````````
``:'``,'`,;;:;;_+(?+^^l/,;'``````````````````
``',,,'`,;_-|_"~~l_-`+=(V.```````````````````
``,`,''.:~___^_,;?l_v=yzy.```````````````````
``~'`',+/"++_jI::>]xja5FT_```````````````````
``~:,,,_)>_^vj!~:_ypZgy*j(```````````````````
```.':,)\+_x?=+`;jM4?ZFT4(```````````````````
```...`i/\+)??(~"?7T_7TL*'```````````````````
```.....\^!_vjl;,>?T&_Tp`.```````````````````
```````~+;_^_jx\;i?TK*fT,.```````````````````
````````'.+<(!_-~~-_L?%T..```````````````````
````````'..(^_+;/+!TyuL[\.```````````````````
````````'..i(^((-|_jTyU5~!```````````````````
````````'..-\~^(~vXW6ydd_]!,`````````````````
````````'.."(\~-/??VhwF$>fIj_````````````````
````````'../|__-)_~_jTg[jJI?j(;......````````
````````'.-,~_i_vxj7jyE>j[[}?^+7v_...````````
````````'.,:,>vYj[??jR~_Ojt!j\\>?V7k.````````
````````:'i;'>v?t[^vd[,jI[[i[:/^_v{j7u;``````
```````-,,}j,~>^+~jgP;_4IIiv(-|_)_iIu?j_,````
```....:,'jjI`~^_+~7('LLk=uY_(/i^_?Y!!!!n(.``
```...,,''^-L[`>7`'.~.~TwL[z>i>~;?_??1j[Ij]``
```..~,`,_/.,,{;:';>;.~YLT7k_xx;(vv+vf?L!T[z`
```.;>;-v~',::/-;/\_/,.~*pj[\_!~~^|~j[~JvV[j`
```"-~~:.';_:;/;j)_?),,.~&wr)!n(~|_"j['?}Xp7,
``:/'.":`/v+((:j[_iv~:/;.?T[\iu(">-;j[,_^v4Li
`~/",',:-/>(-~v7__i(~,/~~vRI_i?__-((j[,>)_9Lw
/:;;,,,:"-_x':i}(_+(?v!jpjFiI(}(v_>;T[,)'_TTU
;,-",,,;">+|`,~v)+(-xuiv4jF^I(>x_i_'w]':"v7O1
;`;,''_'->?'`:~>>_<~vf(_gVPv[:~?vl}_qL/,">jqq
/"'':,/`~_i`,;,>_^<~iJ"iFv[?[\/?=Il-TL-'-_jTd
,/,,:,(,_}~,;;,i_^)/"1/IT_[jx'(?=I?_w*:."_Y7g
~:':,_"-??.,":'+__<|"w;Yji[p(v_?=u?>d&,./>?VM
Test on some images!


Rendering is explicitly set to 30 frames per second plus the poor performance of the Javascript memory allocator so expect small lag depending on your CPU/Browser configuration.

Webcam/Camera Stream


Output Stream


How the algorithm works

ASCII art is a related (and older) graphic design technique for producing images from printable characters.

Given an input image or video frame, perform the following steps:

  • Divide the input image into rectangular grid of equal size. The grid size correspond to the height and width of a single tile (i.e. font glyph) obtained form the codebook used during the training phase.

  • For each cell, a font glyph is selected from the codebook to replace the raw pixels in this cell. The glyph is obtained by feeding the raw pixels into a decision tree where the output of the tree is the index of the target tile in the codebook.

  • The tree is learned by first converting a large set of images to ASCII art with SSIM index and then using the obtained data as a training set.

You are invited to take a look at the original paper for a detailed overview of the whole process:

N. Markus, M. Fratarcangeli, I. S. Pandzic and J. Ahlberg, "Fast Rendering of Image Mosaics and ASCII Art", Computer Graphics Forum, 2015, <dx.doi.org/10.1111/cgf.12597>


Embedding & API Reference

ASCII Art is a single file C/C++ library that can be embedded into larger programs to perform this kind of processing:




Get Started with the PixLab Machine Vision & Media Processing APIs.




Comments System WIDGET PACK