Demos
See examples and live demos built with TensorFlow.js.
Transport yourself to a tropical beach, outer space, and elsewhere with the power of web ML.
See how well you synchronize to the lyrics of the popular hit "Dance Monkey." This in-browser experience uses the Facemesh model for estimating key points around the lips to score lip-syncing accuracy.
Use your phone's camera to identify emojis in the real world. Can you find all the emojis before time expires?
No coding required! Teach a machine to recognize images and play sounds.
Train a server-side model to classify baseball pitch types using Node.js.
See how to visualize in-browser training and model behaviour and training using tfjs-vis.
Community demos
Get started with official templates and explore top picks from the community for inspiration.
Check out community Glitches and make your own TensorFlow.js-powered projects.
Fork boilerplate templates and check out working examples from the community.
See what the community has created and submitted to the TensorFlow.js gallery page.
Learn the latest on new projects created with TensorFlow.js and share your own by using the hashtag!
| Example | Input data type | Task type | Model type | Training environment | Inference environment | API type | Demo |
|---|---|---|---|---|---|---|---|
| abalone-node | Numeric | Loading data from local file and training in Node.js | Multilayer perceptron | Node.js | Node.js | Layers | No demo |
| addition-rnn | Text | Sequence-to-sequence | RNN: SimpleRNN, GRU and LSTM | Browser | Browser | Layers | View Demo |
| addition-rnn-webworker | Text | Sequence-to-sequence | RNN: SimpleRNN, GRU and LSTM | Browser: Web Worker | Browser: Web Worker | Layers | No demo |
| angular-predictive-prefetching | Numeric | Multiclass predictor | Deep Neural Network | Browser: Service Worker | Browser: Service Worker | Layers | No demo |
| baseball-node | Numeric | Multiclass classification | Multilayer perceptron | Node.js | Node.js | Layers | No demo |
| boston-housing | Numeric | Regression | Multilayer perceptron | Browser | Browser | Layers | View Demo |
| cart-pole | horizontal_rule | Reinforcement learning | Policy gradient | Browser | Browser | Layers | View Demo |
| chrome-extension | Image | (Deploying TF.js in Chrome extension) | Convolutional neural network | horizontal_rule | Browser | horizontal_rule | No demo |
| custom-layer | horizontal_rule | (Defining a custom Layer subtype) | horizontal_rule | horizontal_rule | Browser | Layers | View Demo |
| data-csv | horizontal_rule | Building a tf.data.Dataset from a remote CSV | horizontal_rule | horizontal_rule | horizontal_rule | horizontal_rule | View Demo |
| data-generator | horizontal_rule | Building a tf.data.Dataset using a generator | Regression | Browser | Browser | Layers | View Demo |
| date-conversion-attention | Text | Text-to-text conversion | Attention mechanism, RNN | Node.js | Browser and Node.js | Layers | View Demo |
| electron | Image | (Deploying TF.js in Electron-based desktop apps) | Convolutional neural network | horizontal_rule | Node.js | horizontal_rule | No demo |
| fashion-mnist-vae | Image | Generative | Variational autoencoder | Node.js | Browser | Layers | No demo |
| interactive-visualizers | Image | Multiclass classification, object detection, segmentation | horizontal_rule | horizontal_rule | Browser | horizontal_rule | No demo |
| iris | Numeric | Multiclass classification | Multilayer perceptron | Browser | Browser | Layers | View Demo |
| iris-fitDataset | Sequence-to-sequence | Multiclass classification | Multilayer perceptron | Browser | Browser | Layers | View Demo |
| jena-weather | Text | Sequence-to-prediction | MLP and RNNs | Browser and Node.js | Browser | Layers | View Demo |
| lstm-text-generation | Image | Sequence-to-prediction | RNN: LSTM | Browser | Browser | Layers | View Demo |
| mnist | Image | Multiclass classification | Convolutional neural network | Browser | Browser | Layers | View Demo |
| mnist-acgan | Image | Generative adversarial network | Convolutional neural network; GAN | Node.js | Browser | Layers | View Demo |
| mnist-core | Image | Multiclass classification | Convolutional neural network | Browser | Browser | Core (Ops) | View Demo |
| mnist-node | Image | Multiclass classification | Convolutional neural network | Node.js | Node.js | Layers | No demo |
| mnist-transfer-cnn | Image | Multiclass classification (transfer learning) | Convolutional neural network | Browser | Browser | Layers | No demo |
| mobilenet | Image | Multiclass classification | Convolutional neural network | horizontal_rule | Browser | Layers | View Demo |
| polynomial-regression | Numeric | Regression | Shallow neural network | Browser | Browser | Layers | View Demo |
| polynomial-regression-core | Numeric | Regression | Shallow neural network | Browser | Browser | Core (Ops) | View Demo |
| quantization | Various | Demonstrates the effect of post-training weight quantization | Various | Node.js | Node.js | Layers | No demo |
| sentiment | Text | Sequence-to-binary-prediction | LSTM, 1D ConvNet | Node.js | Node.js or Python | Layers | View Demo |
| simple-object-detection | Image | Object detection | Convolutional neural network (transfer learning) | Node.js | Browser | Layers | View Demo |
| snake-dqn | horizontal_rule | Object detection | Deep Q-Network | Node.js | Browser | Layers | View Demo |
| translation | Text | Sequence-to-sequence | LSTM encoder and decoder | Node.js or Python | Browser | Layers | View Demo |
| tsne-mnist-canvas | horizontal_rule | Dimension reduction and data visualization | tSNE | Browser | Browser | Core (Ops) | No demo |
| webcam-transfer-learning | Image | Multiclass classification (transfer learning) | Convolutional neural network | Browser | Browser | Layers | View Demo |
| website-phishing | Numeric | Binary classification | Multilayer perceptron | Browser | Browser | Layers | View Demo |