karretOS banner

karretOS

13 devlogs
27h 55m 18s

Updated Project: made the 2026 version of my original portfolio made last year. this one merges my portfolio with the webos
Made my newer portfolio for 2026 as a WebOS

This project uses AI

used AI for a bit of refactoring especially when i tried to deploy it on github but that sucked so now its deployed on vercel.

Demo Repository

Loading README...

1nf1n0t1v3r

Shipped this project!

Hours: 14.95
Cookies: 🍪 326
Multiplier: 21.79 cookies/hr

it is hard to have a comeback after 2 weeks of afk-ness. still i built some stuff, mostly optimization (sad i can’t ship it for multiple sidequests). there’s a devtools, better settings, more speed in this ship.

1nf1n0t1v3r

apps are now lazy loaded to have a much faster initial boot time and save on memory. made some animations smoother. now apps without sidebar have a solid background by default (can be overrided) and a better boot screen (no loading bar progress %tage and a better unlock button)

0
1nf1n0t1v3r

after a few weeks of no coding due to personal reasons, i am back. worked on devtools (ignore the lack of blur in the screenshot)

Attachment
0
1nf1n0t1v3r

Resizable windows

How it works

  • useSession.ts holds the “source of truth” for size + position
  • AppWindow.tsx renders the window using that size/position
  • react‑rnd tells us the new size/position when the user drags/resizes

1. useSession

it has size: {w,h} and offset : {x, y} which decide the width/height of the window and where it sits on the screen.

2. default size/position

by default, window gets 80% of screen width and 70% height (clamped to ~960x640 so it doesnt get huge)

  • a random offset is added so windows are not perfectly stacked when opened.

react-rnd

replaced default framer’s drag with the react-rnd library which saves the new x/y on move or w/h on resize, passes it to useSession and now it renders on new position or new height/width.

0
1nf1n0t1v3r

Lock screen, top bar and back end updates

I cleaned up a lot of logic and performance optimizations. the top bar was tricky to make due to the existing project structure, finally figured it out by re doing the shell and environment layouts and add a top margin so that windows don’t go over the top bar.

Simplified framer animations and stuff that you won’t really see on the demo but it works smoother and faster now. Stuff like z-index configuration, removing unused noise overlays which put a lot of load on the rendering process. I also removed layout property in dock’s motion animations to make the UI sleek and light.

Portfolio App’s wakatime stats section was redesigned and should work now.

Attachment
Attachment
0
1nf1n0t1v3r

Dark Mode, New Widgets and Layout

(see 2nd pic for older layout)

1. DARK theme. I dont want to blind you folks

Every element and component has been inverted so the default theme is now dark (and thats the only theme)

2. Greetings widget

that guy looked awkward in the left side so made it a widget like other stuff and moved to right (it will be customizable later)

3. App Drawer Bg

it looks better (especially on mobile devices) and now you can also know the number of apps

and yeah quickcontrols is remvoed

Attachment
Attachment
0
1nf1n0t1v3r

NEW WINDOWS APP & LOCK SCREEN

THIS is what windows deserve and yeah also made a minimalist lock screen
@rupnil.codes this is for yaaa

Attachment
Attachment
0
1nf1n0t1v3r

Refine the visual system, new reusable components, and improved core interactions, clean up etc.

Features

  • Introduced a new visual configuration hook and applied it across the UI for consistent blur and transparency behavior
  • Added a new set of reusable components and migrated existing parts of the app to use them
  • Implemented an icons-only dock with click-to-open interaction
  • Enabled launching apps directly through the terminal
  • Added automatic portfolio launch on system boot
  • Updated portfolio projects with latest content
  • Added a new favicon

UI / Style

  • Updated background styling
  • Replaced emojis with icons in the settings app for a cleaner interface

Refactoring

  • Standardized internal code structure and patterns
  • Renamed style settings to clearer background and transparency modes

Chores

  • Removed legacy blur and opacity modules after migrating to the new visual system
  • Replaced default Vite assets with project-specific favicon
Attachment
0
1nf1n0t1v3r

Blur Configuration, WindowLayouts, Widgets update

I added a widgetUpdater hook to simplify widget updates. Also added detailed weather view (apparent temperature etc etc). Background and opacity levels are now independent (and not stored in local storage to simplify logic). Icons and components are now blurred and made transparent on the choice
WIdgets are now shown on smaller devices too. Also created a WindowLayout component to have uniform styling and layouts for all apps with ability to set custom header and footer. Also the titlebar is now spread out as in widnows (left side name of the app and right side controls). Full screen is better with less space left around

Attachment
Attachment
Attachment
0
1nf1n0t1v3r

Shipped this project!

Hours: 12.97
Cookies: 🍪 250
Multiplier: 19.27 cookies/hr

Built the webOS finally. Its basic but works i absolutely love the monochrome theme and slight aniamtions

1nf1n0t1v3r

Fixed the vercel deployment after hours of messing up with github pages

New Stuff

  • Terminal App
  • kNotes App
  • Basic settings with background and opacity controls
  • Analog clock
Attachment
0
1nf1n0t1v3r

Fixed windows z-indices and added a iframe test app called Pomdoro app
Bonus: it also has a cool loading screen now

Attachment
0
1nf1n0t1v3r

Added minimized view and some widgets!

Attachment
0
1nf1n0t1v3r

This is looking so cool ngl. Made it the karretOS

Attachment
0
1nf1n0t1v3r

v3 of my portfolio that’s more than just a portfolio. It’s a browser(or os? or a start-page) from the future. [still working]

Attachment
0