:root { --bg-dark-300: #0a0a0a; --bg-dark-200: #141414; --bg-dark-100: #1f1f1f; --border-gray: #27272a; --text-gray: #9ca3af; --text-white: #f3f4f6; --primary: #a855f7; --cyan: #22d3ee; } body { margin: 0; background-color: var(--bg-dark-300); color: var(--text-white); font-family: 'Inter', 'Roboto', sans-serif; line-height: 1.5; } .ns-container { max-width: 1000px; margin: 0 auto; padding: 60px 20px; } /* Hero Section */ .ns-hero { text-align: center; margin-bottom: 80px; padding-top: 40px; } .ns-badge { display: inline-block; padding: 6px 16px; background-color: var(--bg-dark-100); border: 1px solid var(--border-gray); color: var(--primary); font-size: 0.875rem; font-weight: 600; border-radius: 9999px; margin-bottom: 24px; } .ns-hero h1 { font-size: 4.5rem; font-weight: 800; margin: 10px 0; letter-spacing: -0.025em; line-height: 1.1; } .ns-gradient-text { background: linear-gradient(to right, var(--primary), var(--cyan)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent; } .ns-hero h2 { font-size: 2.25rem; color: #d1d5db; margin: 10px 0 20px 0; font-weight: 500; } .ns-hero p { font-size: 1.125rem; color: var(--text-gray); max-width: 800px; margin: 0 auto 40px auto; line-height: 1.7; } .ns-hero-buttons { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; } .ns-btn-primary { display: inline-block; padding: 14px 32px; background: linear-gradient(to right, #9333ea, #a855f7); color: #fff; text-decoration: none; font-weight: 700; border-radius: 9999px; } .ns-btn-secondary { display: inline-block; padding: 14px 32px; background-color: var(--bg-dark-100); border: 1px solid var(--border-gray); color: #fff; text-decoration: none; font-weight: 700; border-radius: 9999px; transition: background-color 0.2s; } .ns-btn-secondary:hover { background-color: #27272a; } /* General Sections */ .ns-section { margin-bottom: 80px; } .ns-section-header { text-align: center; margin-bottom: 40px; } .ns-section-title { font-size: 3rem; font-weight: 800; margin: 0 0 16px 0; } /* Grid Layouts */ .ns-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; } .ns-grid-cols-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; } /* Cards */ .ns-card { background-color: var(--bg-dark-200); border: 1px solid var(--border-gray); padding: 32px; border-radius: 24px; transition: transform 0.2s, border-color 0.2s; } .ns-card:hover { border-color: rgba(168, 85, 247, 0.5); transform: translateY(-4px); } .ns-card h3 { font-size: 1.5rem; margin: 0 0 16px 0; color: #fff; } .ns-card p { margin: 0; color: var(--text-gray); line-height: 1.6; } .ns-lang-card { background-color: var(--bg-dark-200); border: 1px solid var(--border-gray); padding: 24px; border-radius: 16px; text-align: center; transition: transform 0.2s, border-color 0.2s; } .ns-lang-card:hover { border-color: rgba(34, 211, 238, 0.5); transform: scale(1.05); } .ns-lang-card h3 { font-size: 1.25rem; margin: 0 0 8px 0; color: #f3f4f6; } .ns-lang-card p { font-size: 0.875rem; margin: 0; color: var(--text-gray); } /* Contact Box */ .ns-contact-card { background-color: var(--bg-dark-200); border: 1px solid var(--border-gray); padding: 50px; border-radius: 32px; } .ns-contact-card h2 { font-size: 4rem; font-weight: 800; margin: 0 0 24px 0; line-height: 1.1; } .ns-contact-card p { color: var(--text-gray); font-size: 1.125rem; margin-bottom: 16px; } .ns-contact-link { color: var(--cyan); text-decoration: none; font-weight: 600; } .ns-contact-link:hover { text-decoration: underline; }

Building Enterprise Projects

Hi, I'm Yazan Tarifi

Software Engineer

Mobile App Maestro Building Native Mobile Applications for Android & iOS. I build Solid, modern interfaces with Jetpack Compose and Compose Multiplatform. Driven by performance, I build shared logic using Kotlin Multiplatform and building backend projects using NestJS & Spring Boot to build (Full Stack, SAAS) solutions.

Explore My Work Contact Me

My Architectural Focus

What I Do

Android Development

Building android applications accessible by Milions of Users, With Clean Architecture, MVVM, Clean Code, Kotlin, Jetpack Compose, Firebase, Hilt, Retrofit, Room, WorkManager, Multi Modular Apps.

Web Apps (Backend)

Building Backend Projects and Api's with NestJs, Swagger, PostgreSQL, Firebase, Socket.IO, Configurations, JWT, TypeORM, Docker, Deployments, SSH Servers, Nginx Configurations.

Web Development

Building a Static Sites, Landing Pages with Tailwind CSS, React.js, Typescript, Hosting on Github Pages and Netlify.

Core Languages

Kotlin

Mobile / Backend

Java

Enterprise

TypeScript

Frontend / APIs

Swift

iOS Native

JavaScript

Web / Full-Stack

Ruby

Scripting

Technical Writing

Latest Articles

Explore My Technical Blog

I actively write about Kotlin Multiplatform, NestJS architecture, and systemic designs for enterprise software.

Read on Medium @yazantarifi98

Get In Touch

Let's build
something great.

Location: Amman, Jordan

Email: yazantarifi989@gmail.com

GitHub: github.com/Yazan98