Dev tools are developer tools that are available in your browser. They give you access to the internal working of the page. You can see the HTML code for the page, and from there you can select an element and see which CSS styles it has, and you can edit those styles. That allows you to try things quickly and see what works.
Chrome always comes with the dev tools. In Safari the tools are present but hidden until you to enable the Develop menu in the Advanced preferences. For Firefox you need to download Firefox Developer Edition. Not sure about other browsers, there’s probably something about it in the forum.
If you’re using Chrome, you can access the developer tools with Cmd + Opt + I on Mac and F12 or Ctrl + Shift + I on Windows. You can also find it in the menu: View > Developer > Developer Tools.
When using CodePen, the HTML can be a bit confusing because there is all the code for CodePen itself. When in the Editor View, you find your code under:
3 lines here
<div class="page-wrap twilight">
2 lines here
<div id="result-div" class="result">