Tinker With a Neural Network Right Here in Your Browser.
Don’t Worry, You Can’t Break It. We Promise.

Epoch

Data

Which dataset do you want to use?

Features

Which properties do you want to feed in?

Click a link to edit.
Weight/Bias is 0.2.
This is the output from one neuron. Hover to see it larger.
The outputs are mixed with varying weights, shown by the thickness of the lines.

Output

Test loss
Training loss
Colors show data, neuron and weight values.

Network as JavaScript


    

  


  
  

    
    
  

  

  

    

      
Um, What Is a Neural Network?

      
It’s a technique for building a computer program that learns from data. It is based very loosely on how we think the human brain works. First, a collection of software “neurons” are created and connected together, allowing them to send messages to each other. Next, the network is asked to solve a problem, which it attempts to do over and over, each time strengthening the connections that lead to success and diminishing those that lead to failure. For a more detailed introduction to neural networks, Michael Nielsen’s Neural Networks and Deep Learning is a good place to start. For a more technical overview, try Deep Learning by Ian Goodfellow, Yoshua Bengio, and Aaron Courville.

    


    

      
This Is Cool, Can I Repurpose It?

      
Please do! This project is a fork of this excellent project. Both are open source and built with the hope that they can make neural networks a little more accessible and easier to learn. You’re free to use it in any way that follows the Apache License. And if you have any suggestions for additions or changes, please let us know.

      
To tailor the playground to a specific topic or lesson, use the controls below to choose which features you’d like to be visible below then save this link, or refresh the page.

      

    


    

      
What Do All the Colors Mean?

      
Orange and blue are used throughout the visualization in slightly different ways, but in general orange shows negative values while blue shows positive values.

      
The data points (represented by small circles) are initially colored orange or blue, which correspond to positive one and negative one.

      
In the hidden layers, the lines are colored by the weights of the connections between neurons. Blue shows a positive weight, which means the network is using that output of the neuron as given. An orange line shows that the network is assigning a negative weight.

      
In the output layer, the dots are colored orange or blue depending on their original values. The background color shows what the network is predicting for a particular area. The intensity of the color shows how confident that prediction is.

    


    

      
What Library Are You Using?

      
The NN playground is implemented on a tiny neural network library
      that meets the demands of this educational visualization. For training real-world applications in the browser, consider the
      TensorFlow library.
      

    


    

      
Credits

      

        This version of the NN Playground was created by David Cato.
      

      

        The original NN Playground was created by Daniel Smilkov and Shan Carter as a continuation of many people’s previous work — most notably Andrej Karpathy’s convnet.js demo
        and Chris Olah’s articles about neural networks.
        D. Sculley helped with the original idea. Fernanda Viégas and Martin Wattenberg and the rest of the
        Big Picture and Google Brain teams gave valuable feedback and guidance.