outer readme

README.md

@@ -0,0 +1,22 @@
+<div align="center">
+<img src="https://github.com/typed-rocks/type-buddy/blob/main/extension/imgs/typebuddy-icon.png?raw=true" alt="Icon" width="150">
+</div>
+<h1 align="center" style="font-weight: bold; font-size: 40px;">Type Buddy 🤝</h1>
+
+<p align="center" style="font-size: 30px">Finally make <i>sense</i> of your complex types</p>
+<p align="center" style="font-size: 30px"><a href="">💻 VSCode Extension</a> | <a href="">🌐 Web App</a></p>
+<div align="center">
+<p style="font-size:25px">Just <b><i>hover over</i></b> your complex type and reveal the ✨beautiful function✨...</p>
+<img src="https://github.com/typed-rocks/type-buddy/blob/main/extension/imgs/hover.png?raw=true" alt="Type Buddy Hover" height="400">
+<br /><br />
+<p style="font-size:2rem">🕵️‍♂️ <b>Show Type Functions</b></p>
+<p style="font-size: 1.25rem">
+Open any TypeScript file, Use the 🎨 command <code>Type Buddy: Show Type Functions</code>, Update your code and the viewer will show you the results as functions.</p>
+<img src="https://github.com/typed-rocks/type-buddy/blob/main/extension/imgs/show-functions.png?raw=true" alt="Type Buddy: Show Functions" height="400px" />
+
+<p style="font-size:2rem">👀 <b>Type Viewer</b></p>
+<p style="font-size: 1.25rem">
+Either use the command <code>Type Buddy: Create Type Buddy Document</code> to create a new <code>.tb</code> file or use an existing one and run the <code>Type Buddy: Open Type Viewer</code> command to start the viewer. Then update your code and the viewer will show you the types as functions.</p>
+
+<img src="https://github.com/typed-rocks/type-buddy/blob/main/extension/imgs/type-preview.png?raw=true" alt="Type Preview" height="400">
+</div>