1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5159],{1435:e=>{e.exports={ChordMap:"styles_ChordMap__iMXgj",modeSelector:"styles_modeSelector__daczg",modeButton:"styles_modeButton__TLEC0",active:"styles_active__cJNoy",map:"styles_map__HGeZL",rightChords:"styles_rightChords___YI7A",centerArrows:"styles_centerArrows__9AfA0",ChordBox:"styles_ChordBox__3Ntht",name:"styles_name__tn0qA",leftChords:"styles_leftChords__2OtQV",downArrow:"styles_downArrow__eZhXt",box:"styles_box__cYDKA",ChordBoxWrapper:"styles_ChordBoxWrapper__pMlLq",skipArrow:"styles_skipArrow__kzfgr"}},10429:(e,s,r)=>{"use strict";r.d(s,{A:()=>d});var o=r(37876),t=r(75597),a=r(15039),l=r.n(a),i=r(20399),n=r.n(i);let d=function(e){let{keyOffset:s=0,noHeader:r=!1,onClick:a=e=>{},keyType:i="Major"}=e;return(0,o.jsxs)("div",{children:[!r&&(0,o.jsxs)("h2",{children:[t.nX[s].name," ",i," Key"]}),(0,o.jsx)("div",{className:n().KeySelector,children:t.nX.map((e,r)=>(0,o.jsx)("div",{className:l()(n().key,{[n().active]:r===s}),onClick:()=>a(r),children:e.name},e.name))})]})}},20399:e=>{e.exports={KeySelector:"styles_KeySelector__YaDEp",key:"styles_key__SFrDJ",active:"styles_active__UsQ85"}},41894:(e,s,r)=>{"use strict";r.r(s),r.d(s,{__N_SSP:()=>c,default:()=>h});var o=r(37876),t=r(49907),a=r(25313),l=r(16547),i=r(23619);let n=i.pM,d=i.C;var c=!0;let h=function(){return(0,o.jsx)(l.A,{lesson:n,nextLesson:d,children:(0,o.jsxs)(a.A,{children:[(0,o.jsx)("h2",{children:"Chord Maps"}),(0,o.jsx)("p",{children:"While there are no rules with chord progressions there are some popular guidelines. One of the common tools for finding great progressions is the Chord Map."}),(0,o.jsx)("p",{children:"The Chord Map shows us which chord changes create and resolve tension in the most pleasing ways."}),(0,o.jsx)("p",{children:"To use the Chord Map:"}),(0,o.jsxs)("ul",{children:[(0,o.jsx)("li",{children:"Start by playing the I chord."}),(0,o.jsx)("li",{children:"Then choose any chord in the map to play next."}),(0,o.jsx)("li",{children:"Next, move to a chord along one of the arrows."}),(0,o.jsx)("li",{children:"Continue until you return the I chord."})]}),(0,o.jsx)(t.A,{}),(0,o.jsxs)("p",{children:["Remember that these are not rules. Musicians break from the Chord Map all the time. However, a Chord Map is a great place to start with Chord Progressions. Once ","you're"," comfortable with them, ","you'll"," ","have a better idea of where you can break away from the Chord Map."]})]})})}},49907:(e,s,r)=>{"use strict";r.d(s,{A:()=>_});var o=r(37876),t=r(10429),a=r(84048),l=r(75597),i=r(14232),n=r(1435),d=r.n(n);let c={1:"#e54c4e",2:"#e4ab51",3:"#d8dd51",4:"#aed747",5:"#3fa9b4",6:"#4e45b3"},h={1:"I",2:"ii",3:"iii",4:"IV",5:"V",6:"vi"},m={1:"i",2:"ii\xb0",3:"III",4:"iv",5:"v",6:"VI"};function p(e){let{keyOffset:s=0,relative:r=0,last:t=!1,skipArrow:a=!1,playNote:i=(e,s)=>{},mode:n="major"}=e,{name:p,chord:_}="major"===n?(0,l.J5)(s,r):(0,l.qk)(s,r);return(0,o.jsxs)("div",{className:d().ChordBoxWrapper,children:[(0,o.jsxs)("div",{className:d().ChordBox,children:[(0,o.jsxs)("div",{className:d().name,children:[(0,l.al)(s,p),(0,o.jsx)("span",{className:d().minor,children:"major"===n?[2,3,6].includes(r)?"m":"":[1,4,5].includes(r)?"m":2===r?"\xb0":""})]}),(0,o.jsx)("div",{className:d().box,style:{backgroundColor:c[r],color:"#fff"},onClick:()=>i(_,"4n"),children:("major"===n?h:m)[r]})]}),a&&(0,o.jsx)("img",{className:d().skipArrow,src:"https://res.cloudinary.com/dxdfbexap/image/upload/v1723695939/lightnote/chord-map-arrow-jump_memxbo.png"}),!t&&(0,o.jsx)("img",{className:d().downArrow,style:{width:"70px"},src:"https://res.cloudinary.com/dxdfbexap/image/upload/v1723695940/lightnote/chord-map-arrow_bu0voa.png"})]})}let _=function(){let{playNote:e}=(0,a.J)(),[s,r]=(0,i.useState)(4),[l,n]=(0,i.useState)("major");return(0,o.jsxs)("div",{className:d().ChordMap,children:[(0,o.jsx)(t.A,{keyOffset:s,onClick:r,keyType:"major"===l?"Major":"Minor"}),(0,o.jsxs)("div",{className:d().modeSelector,children:[(0,o.jsx)("button",{className:"".concat(d().modeButton," ").concat("major"===l?d().active:""),onClick:()=>n("major"),children:"Major"}),(0,o.jsx)("button",{className:"".concat(d().modeButton," ").concat("minor"===l?d().active:""),onClick:()=>n("minor"),children:"Minor"})]}),(0,o.jsxs)("div",{className:d().map,children:[(0,o.jsxs)("div",{className:d().leftChords,children:[(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:2,mode:l}),(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:3,mode:l}),(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:4,skipArrow:!0,mode:l}),(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:5,mode:l}),(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:1,last:!0,mode:l})]}),(0,o.jsx)("div",{className:d().centerArrows,children:(0,o.jsx)("img",{style:{width:"35px"},src:"https://res.cloudinary.com/dxdfbexap/image/upload/v1723695940/lightnote/chord-map-arrow-row_cl3u4a.png"})}),(0,o.jsxs)("div",{className:d().rightChords,children:[(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:5,mode:l}),(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:6,mode:l}),(0,o.jsx)(p,{playNote:e,keyOffset:s,relative:2,last:!0,mode:l})]})]})]})}},87785:(e,s,r)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/lessons/progressions/chord-maps",function(){return r(41894)}])}},e=>{e.O(0,[8230,9245,636,6593,8792],()=>e(e.s=87785)),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.