Overview

Currently  building  a  white-label  website  auditing  platform  for  web  agencies  to  generate  professional,  client-ready  web  performance  reports. 

Overview

PurposeUI  is  an  opinionated  internal  design  system  developed  in  collaboration  with  Ideas  On  Purpose.  It  establishes  a  consistent  approach  to  responsive  design  through  fluid  design  tokens,  a  configurable  grid  system,  automatic  color  shade  generation,  theme  support,  reusable  components,  and  utility  classes.  Typography,  spacing,  sizing,  radii,  and  shadows  all  derive  from  a  shared  token  system,  allowing  designers  to  focus  on  mobile  and  desktop  layouts  while  the  system  seamlessly  scales  every  viewport  in  between,  significantly  reducing  the  effort  required  to  design  and  build  responsive  websites. 

Features

• Fluid design token engine
• Responsive grid and layout system
• Theme engine powered by CSS vars
• Automatic color shade generation
• Generated utility class library
• Composable component primitives
• Comprehensive documentation website

Overview

CSSans  Pro  —  The  Colourful  CSS  Font  —  is  an  experimental  typeface  where  every  letter  is  constructed  entirely  with  HTML  and  CSS,  by  using  classes,  pseudo-elements,  gradients,  border-radius,  transforms,  and  CSS  custom  properties.  The  project  gained  attention  within  the  web  development  community  for  showcasing  advanced  CSS  techniques,  earned  recognition  from  design  organizations,  and  inspired  more  experiments  in  CSS-based  faux  typography. 

Features

• Uppercase & lowercase letters
• Numbers & punctuation
• Themeable colors using CSS variables
• Complete documentation
• MIT license (open source)

Overview

YouTubeOnRepeat.com  was  my  longest-running  personal  project  and  one  of  the  early  websites  dedicated  to  looping  YouTube  videos,  6  years  before  YouTube  introduced  looping  as  a  feature.  Built  on  the  YouTube  API,  it  began  as  a  PHP  application,  evolved  into  a  jQuery-powered  frontend,  and  ultimately  became  a  Vue.js  SPA.  Users  could  save  playlists  and  favorite  videos  without  creating  an  account  by  leveraging  the  browser's  then-new  localStorage  API,  eliminating  the  need  for  a  backend  account  system.  At  its  peak,  the  site  reached  over  1  million  monthly  users  with  an  average  session  duration  of  45  minutes. 

Features

• Loop YouTube videos indefinitely
• Loop specific segments of a video
• Save playlists and favorite videos
• Export and back up user data
• No account needed
• Video search (via YT API)
• Ad-supported monetization

Overview

An  exploration  of  the  creative  limits  of  CSS,  this  project  allowed  users  to  draw  pixel  art,  animate  it  frame  by  frame,  and  export  production-ready  CSS  box-shadow  animations,  transparent  PNG  and  GIF  files.  It  became  the  foundation  for  many  of  my  later  pixelart  CodePen  experiments. 

Features

• Frame-by-frame animation timeline
• CSS box-shadow generation
• Import images and convert to pixel art
• Export to CSS, GIF, PNG, and HTML
• One-click CodePen export
• Color palette with automatic shades
• LocalStorage project persistence

Overview

CodePen  has  been  my  creative  playground  for  more  than  a  decade.  It's  where  I  experiment  with  things  that  don't  belong  in  client  projects—CSS-only  art,  conceptual  animations,  browser  experiments,  tiny  games,  pixel  art  made  with  a  million  box-shadows.  Some  of  the  work  has  been  featured  by  the  Microsoft  Dev  Blogs,  CSS-Tricks,  Smashing  Magazine,  and  other  front-end  publications.  My  most  popular  pen  has  over  400,000  views  and  is  still  being  referenced  more  than  12  years  later. 

Features

• CSS pixelart and illustrations
• Animation and motion experiments
• Tiny games and interactive toys
• Browser API explorations
• Creative UI concepts
• Visual effects and typography
• Beautifully useless ideas