Baseuse

• 

  HTML file elements highlighted

• 

  Results shown in output

• 

• 

  The profile screen

Inspiration

Looking at how certain elements only break your site when launched, and how testing a webapp in all the browsers this eliminates the headache of doing all that

What it does

I built this VS Code extension to make working with CSS values easier and more consistent. It scans your code, finds pixel values, and helps convert them to rem units. It also shows browser support details right inside the editor.

I made it because I often found myself switching between my code and browser docs just to check if a CSS property was supported or to do quick conversions. It’s a small problem, but it adds up over time.

I tried to keep the extension lightweight and simple. It runs locally, doesn’t need an internet connection, and uses hover tooltips and quick fixes to show info without getting in your way. My goal was to build something that just fits naturally into the coding workflow

How we built it

We built it using Typescript

Challenges we ran into

We would get undefined when searching some elements or css functions

Accomplishments that we're proud of

Finally building and deploying (on azure) a vscoed extension!!!!!

What we learned

Building a vscode extension and that publishing an extension is not that simple

What's next for Baseuse

Built With

• javascript
• node.js
• typescript