Astrit

Astrit

Design & Code in Stockholm, Sweden

About

I have over a decade of experience in design and coding, specialising in CSS, cross-platform human interface design, and design systems.

In 2022, I won the Figma Award and have been recognised twice by Adobe. I’m also a certified by Google and a YouTube content creator, creator of the popular open-source icon library CSS.GG, which has over 46k stars on Figma, 9k+ stars on GitHub, and 20k+ weekly NPM installs.

I’ve worked with notable clients such as Google, Absolut Vodka, Aimo, Kronfagel, and Biersdorf in Switzerland, the United States, Kosovo, and Sweden.

Currently, I work as Design Engineer at SEB Bank in Stockholm, Sweden.

Consistently experimenting with the latest CSS/Web features to gain a deeper understanding of their limitations is what I am passionate about.

Stack: Vercel, Next, Sanity and Stitches
Tools: Code, Figma, Raycast, Arc, Linear, Spline, Warp and Craft

Projects

2023
GONA
2022

A three.js experience for Nämdöskärgården, one of the larges island on the Stockholm archipelago.

2022

A handpicked selection of glyphs for daily use, Copy & Paste SVG, PNG and Figma variable

2022

Portfolio for Sunny at Sea the company where I work at, featuring the projects like Google, Fading Stories, Max etc.

2021
Nors

Nors UI helps developers to build a better web experience. Accessible low level elements and components that are as easy to customize as HTML. Zero restrictions. Access markup at 
a granular level.

2021

Personal portfolio of my wife, built using Next JS, Framer motion, locomotive scroll etc.

2020
2020

A collection of minimal 700+ Pure CSS, SVG Figma & Adobe XD UI Icons Available in SVG Sprite, styled-components, NPM & API

· Figma Community Award winner for 2022
· 46,000 duplicates on Figma
· 9,000 stars on Github
· 4mil+ visitors
· Nr.1 in Google for CSS icons

· Pure CSS version, SVG and PNG

· Easy integrate using open API endpoints available with all icon details including style, markup, SVG Sprite, SVG Encoded etc.

· Preview icons for all details, copy as SVG and CSS, Markup and all details on each icon page

· Pure CSS, you can apply the style to any class and they are designed to stand alone without breaking your layout meanwhile inheriting the colour using `currentColor`

· CSS.GG is also available on @react-icons

2019

Website for a architecture studio based in Prishtina

2018

Personal portfolio, at the time built using WP and custom structure with no plugins, camera gesture and voice control features as an experiment.

Side Projects

2022

A collection of my best photos from Stockholm, Prishtina, Tokyo etc.

2021

A tutorial I did on youtube using some of the most unique features of CSS like position sticky, blend mode, custom scrollbars all in pure CSS.

2021

A CSS experiment on simulating a blackhole on deep space with audio, using backdrop and animations only.

Speaking

2024
Stockholm, Sweden

I talked about SEB:s Green Design System at Dun & Bradstreet Europe HQ in Stockholm, Sweden

Me and Marwin Brandt delved into the intricacies of building a robust and efficient design system.

Showcased some rad #CSS techniques and how we fuse them into our web components, delivering inclusive, user-centric banking design experiences and how we take advantage of Figma API:s for a streamlined process between two worlds <code/> and deƨign.

Big thanks to Hana Yusof for extending the invitation! It was a privilege to share insights and connect with fellow design enthusiasts.

2023
Stockholm, Sweden

I had the chance to talk CSS and how we leverage adaptable techniques within the Green Design System, also demonstrated how to deliver inclusive and user-centric banking design experiences.

Later on alongside exceptional colleagues Vilhelm Sjölander and Joacim Magnusson, we engaged in insightful 1:1 sessions, addressing questions related to Green.

2023
Pristina, Kosovo

I talked about the latest and most noteworthy advancements in CSS.

Furthermore, I provided a comprehensive overview of SEB's Green Design System and delved into our strategy for creating a dependable and inclusive design system tailored to user preferences.

My presentation encompassed a broad range of topics, including color-mix, container queries, @media features like reduced motion, contrast, typography, specificity and @layer rule, View Transitions API, and many other essential elements of modern web design.

Writing

2023

In this detailed and personal exploration, I will discuss the color-mix() function from my perspective, delving into various color spaces, such as HSL, RGB, LCH, and sRGB, and providing in-depth examples to showcase the versatility and potential of this innovative addition to the CSS specification. Furthermore, we will explore the benefits of incorporating the color-mix() function into design systems with tokens, along with examples showcasing how to work with colors and their alpha values, as well as using CSS custom properties on the :root element.

2019
Featured from Adobe

Work Experience

2023 — Now
Stockholm
  • Developed a user-focused and inclusive web design system using React, Lit, Next JS, and other web technologies.

  • Launched the initiative seb.io to improve our Green and open-source software (OSS), creating a more user-friendly experience and a centralized hub for OSS.

  • Created an advanced Figma plugin that enhances design workflows and boosts productivity for our team.

  • Took a forward-thinking approach to front-end development by incorporating the latest CSS features and prioritizing accessibility and user preferences.

  • Integrated Figma variables into our design workflow to improve consistency and automate processes.

  • Presented as a speaker at industry events, sharing knowledge and representing SEB.

  • Emphasize celebrating successes, learning from mistakes, and having a passion for work.

2012 — Now
Remote

III — The umbrella brand for my freelance projects

Development:
React, Next, Vue, Vite, Stencil, Stitches, AWS, Digital Ocean, Vercel, VS Code, Git, Emotion, Framer, Typescript, Web Components, E-Commerce, WordPress, Webflow, Gulp, Tailwind, Sass, PHP, Svelte, NPM, Yarn, Docker, Sanity

Design
Cross-platform human interface design and design systems, UI ( Mobile, Web ), Wireframing, User Experience, research, prototyping, interaction design and user testing.

2019 — 2023

Contact

Youtube
GitHub
Figma
LinkedIn
Twitter