init commit
BIN
assets/a-string/6add9.png
Normal file
|
After Width: | Height: | Size: 142 KiB |
BIN
assets/a-string/7sus2.png
Normal file
|
After Width: | Height: | Size: 136 KiB |
BIN
assets/a-string/M9.png
Normal file
|
After Width: | Height: | Size: 127 KiB |
BIN
assets/a-string/m6add9.png
Normal file
|
After Width: | Height: | Size: 148 KiB |
BIN
assets/a-string/m9.png
Normal file
|
After Width: | Height: | Size: 124 KiB |
BIN
assets/a-string/madd9.png
Normal file
|
After Width: | Height: | Size: 140 KiB |
BIN
assets/a-string/msharp5add9.png
Normal file
|
After Width: | Height: | Size: 149 KiB |
BIN
assets/a-string/sus2.png
Normal file
|
After Width: | Height: | Size: 135 KiB |
BIN
assets/m7/6sus2b5.png
Normal file
|
After Width: | Height: | Size: 147 KiB |
BIN
assets/m7/7b13.png
Normal file
|
After Width: | Height: | Size: 129 KiB |
BIN
assets/m7/7sharp9sus2.png
Normal file
|
After Width: | Height: | Size: 152 KiB |
BIN
assets/m7/7sus2.png
Normal file
|
After Width: | Height: | Size: 143 KiB |
BIN
assets/m7/9sus4.png
Normal file
|
After Width: | Height: | Size: 170 KiB |
BIN
assets/m7/M13.png
Normal file
|
After Width: | Height: | Size: 128 KiB |
BIN
assets/m7/M7.png
Normal file
|
After Width: | Height: | Size: 121 KiB |
BIN
assets/m7/Msharp11.png
Normal file
|
After Width: | Height: | Size: 128 KiB |
BIN
assets/m7/m11.png
Normal file
|
After Width: | Height: | Size: 126 KiB |
BIN
assets/m7/m13.png
Normal file
|
After Width: | Height: | Size: 133 KiB |
BIN
assets/m7/minor7.png
Normal file
|
After Width: | Height: | Size: 126 KiB |
BIN
assets/triads/6sus4.png
Normal file
|
After Width: | Height: | Size: 131 KiB |
BIN
assets/triads/M7.png
Normal file
|
After Width: | Height: | Size: 119 KiB |
BIN
assets/triads/M72.png
Normal file
|
After Width: | Height: | Size: 119 KiB |
BIN
assets/triads/M73.png
Normal file
|
After Width: | Height: | Size: 119 KiB |
BIN
assets/triads/M7omit3.png
Normal file
|
After Width: | Height: | Size: 139 KiB |
BIN
assets/triads/m7.png
Normal file
|
After Width: | Height: | Size: 116 KiB |
BIN
assets/triads/sus4.png
Normal file
|
After Width: | Height: | Size: 125 KiB |
128
index.html
Normal file
|
|
@ -0,0 +1,128 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Chord Book</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<style>
|
||||
img {
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 800px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* container */
|
||||
.responsive-three-column-grid {
|
||||
display:block;
|
||||
}
|
||||
|
||||
/* columns */
|
||||
.responsive-three-column-grid > * {
|
||||
padding:1rem;
|
||||
}
|
||||
|
||||
/* tablet breakpoint */
|
||||
@media (min-width:768px) {
|
||||
.responsive-three-column-grid {
|
||||
display: grid;
|
||||
grid-auto-rows: 1fr;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="container">
|
||||
<h1>Dominic DiTaranto Chord Book</h1>
|
||||
<p>Provided below are the diagrams of the chords I use the most frequently. I used <a href="https://www.guitarbased.com/diagram-maker/">this site</a> to create the diagrams.</p>
|
||||
|
||||
<b>How To Use:</b>
|
||||
<ul>
|
||||
<li>All chords are note agnostic unless noted otherwise. In other words, you can move them around the fretboard wherever you want</li>
|
||||
<li>Low E string is to the left</li>
|
||||
<li>Sometimes there are X marks for mutes, sometimes there are not, I don't know why. Either way, if it is not explicitly noted with an O mark behind the nut in the diagram, all strings without yellow dots are to be muted!</li>
|
||||
<li>Common chords are not included, this is for intermediate players.</li>
|
||||
<li>I rely heavily on using my thumb to play notes on the low E string. You should learn how to do this! why not use all 5 fingers if you can?</li>
|
||||
<li>There is no real order to these chords, they are grouped into sections based on how I group them in my mind.</li>
|
||||
<li>Haters are gonna say that chord voicings do not matter and it sounds the same wherever you play the chord. They are just haters though.</li>
|
||||
</ul>
|
||||
|
||||
<b>Last Updated:</b> Sat Dec 20 20:16:22 EST 2025
|
||||
|
||||
<hr>
|
||||
|
||||
<h3>I - Derivatives of the min7 shape</h3>
|
||||
<p>I have essentially discovered all of these chords for myself by playing around with the min7 shape pictured below as the first chord. I play the low E string with my thumb on the majority of these chords. Examples in which I do not use my thumb are: 7b13 and 9sus4 (sometimes I do, depends on the situation). These chords make up the bulk of what I play.</p>
|
||||
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/m7/minor7.png" alt=""></div>
|
||||
<div><img src="assets/m7/7sus2.png" alt=""></div>
|
||||
<div><img src="assets/m7/m11.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/m7/m13.png" alt=""></div>
|
||||
<div><img src="assets/m7/7sharp9sus2.png" alt=""></div>
|
||||
<div><img src="assets/m7/6sus2b5.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/m7/7b13.png" alt=""></div>
|
||||
<div><img src="assets/m7/M7.png" alt=""></div>
|
||||
<div><img src="assets/m7/M13.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/m7/Msharp11.png" alt=""></div>
|
||||
<div><img src="assets/m7/9sus4.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
<h3>II - Chords on the A string</h3>
|
||||
<p>Yeah, I cannot really think of another way to classify these.</p>
|
||||
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/a-string/M9.png" alt=""></div>
|
||||
<div><img src="assets/a-string/6add9.png" alt=""></div>
|
||||
<div><img src="assets/a-string/m6add9.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/a-string/msharp5add9.png" alt=""></div>
|
||||
<div><img src="assets/a-string/madd9.png" alt=""></div>
|
||||
<div><img src="assets/a-string/m9.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/a-string/sus2.png" alt=""></div>
|
||||
<div><img src="assets/a-string/7sus2.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
<h3>III - Triads</h3>
|
||||
<p>Not necessarily 1-3-5, but chords with just three notes</p>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/triads/6sus4.png" alt=""></div>
|
||||
<div><img src="assets/triads/sus4.png" alt=""></div>
|
||||
<div><img src="assets/triads/m7.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/triads/M7.png" alt=""></div>
|
||||
<div><img src="assets/triads/M72.png" alt=""></div>
|
||||
<div><img src="assets/triads/M73.png" alt=""></div>
|
||||
</div>
|
||||
<div class="responsive-three-column-grid">
|
||||
<div><img src="assets/triads/M7omit3.png" alt=""></div>
|
||||
</div>
|
||||
<hr>
|
||||
<h3>Notes:</h3>
|
||||
<ul>
|
||||
<li>I will add more chords as they come up</li>
|
||||
<li>I will eventually add a search feature</li>
|
||||
</ul>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||