Perfect circle
It is no joke to remember all the seven diatonic chords in any given key. Here is where the circle of fifths can help.
The rings.
In the outer-most ring, we start with C. Why C? it could be be what ever note, so why not C. Then, going clockwise, the 5th of the previous note is listed. That's why it's called the circle of fifths.
The 5th of C is G. The 5th of G is D....
The amazing things is that, if we go counter-clockwise we get the 4th of the previous note.
The 4th of C is F. The 4th of F is B♭....
Ring one.
The outer-most ring will be our major chords,
Ring two.
Below each note in ring one is the relative minor. What is the relative minor? Well, every major scale has a natural minor scale that contains the same chords.
A minor is the relative minor of C major. F♯ minor is the relative minor of A major.
So the second ring will be our minor chords.
Ring three.
Every major scale has a diminished chord which will be placed below the relative minor. Ring three will contain the diminished chord.
Ring four.
Every major scale has a dominant chord which will be placed below the diminished chord. Ring four will contain the dominant chord
The information.
Right away the circle can give us a bunch of information. Starting from the major chords and working our way into the middle, it will tell us the relative minor, the diminished chord and the dominant chord for each major scale.
Next if we click on any of the chord in our major circle it will highlight all the diatonic chord in that major scale.
If we click on any of the chord in the minor circle, it will highlight all the diatonic chords in that minor scale.
The options.
On the right side there are some check-boxes that are labeled diatonic, relative and parallel. By default they are set to diatonic which is the functionality explained previously.
If it is set to relative, when we click a major chord it will highlight the relative minor. If we click a minor chord, it will highlight the relative major.
The third option is parallel. When clicking on a major chord, this option will highlight the parallel minor and vice versa. What is parallel minor? The parallel minor of C major is C minor... easy.
Harmonic vs Natural
Minor scales are not as straightforward as the major scale, there are actually three: natural, harmonic and melodic minor.
Often in pop music and specially in Jazz, the v chord of the minor scale, (which is a minor chord) is replaced by the V chord (which is a dominant chord) borrowed from either the melodic or harmonic minor scale in the same scale degree. And the vi° is replaced by VI from the harmonic minor
The natural and harmonic options on the right allow for switching between which type of minor scale are used. The default is harmonic to give it a little Jazz (ha ha ha...)
The table
Lastly we have the table on the right. It displays the name of the scale in the top row. Next it displays the chord positions within the scale in the roman numeral system. Last line is the actual name of the chord.