Today we approach to Ascii Art because not everything will be serious web components. With ascii-image you can transform and display the result of converting an image to characters. It may not be particularly useful in your developments, but perhaps you can have a wonderful detail with your friends, partner, family, ... or print it on a t-shirt (
The ascii transformation is done thanks to the library asciify.
Here are some examples. But if you go to the bottom of the page you can generate your own Ascii Art from the link to an image.
The url of this cloud web component is http://www.wpiece.com/p/19_43
Do not forget to include before the component's import the polyfill for web components.
To use it with its basic configuration you need only include it and indicate the original image to present in ascii mode.
<!DOCTYPE html> <html lang="en"> <head> <script src="https://www.wpiece.com/js/webcomponents.min.js"></script> <link rel="import" href="http://www.wpiece.com/p/19_43" /> </head> <body> <ascii-image src="http://your.image.com/name.jpg"></ascii-image> </body> </html>
<ascii-image src="img/vintage-races-18.jpg"> </ascii-image>
<ascii-image src="img/vintage-races-21.jpg" size="650" font-size="3"> </ascii-image>
<ascii-image src="img/vintage-races-16.jpg" size="650" font-size="3" color="770077"> </ascii-image>
<ascii-image src="img/vintage-races-1.jpg" size="650" font-size="3" background-color="6A4A3C" color="EDC951"> </ascii-image>
IMPORTANT: If you use a desktop Chrome browser you can also download it as an image.