Architecture

Core architectural principles that guide NeoJET's design and implementation.

Shared Design System

Design Tokens

colors
fonts
sizing

Web

Mobile

Core Principles

Preserve OJET, Modernize the Core

NeoJET preserves Oracle JET's visual language and behaviors while re-designing the implementation and APIs using React patterns and libraries. (Oracle Sans and Oracle Redwood Icons are not included)

One Design, Everywhere

NeoJET's shared design token system powers consistent themes across web, mobile, and future platforms.

Accessibility by Default

Every component is designed with accessibility in mind. NeoJET aligns with the WCAG Four Principles, ensuring experiences that are Perceivable, Operable, Understandable, and Robust for all users.

Composable by Nature

Small, interoperable components form the foundation build the foundation of NeoJET's design system.

Tech Stack

NeoJET is built with modern web technologies that enable powerful, accessible, and performant user interfaces.

React 19

Leveraging React's latest experimental features for cutting-edge component architecture and improved rendering performance.

React Aria

Adobe's library of unstyled, accessible UI primitives that provide robust keyboard navigation, ARIA support, and cross-platform interactions.

Tailwind CSS

Utility-first CSS framework configured with custom design tokens to maintain consistency with the Oracle JET design system.

Vite

Lightning-fast build tool that provides instant server start, hot module replacement, and optimized production builds.

React Native + Expo

Cross-platform mobile framework enabling native iOS and Android apps with the same design tokens and component architecture.

React Ecosystem

The React ecosystem of libraries enable visually rich and performant user experiences. These libraries include Recharts, Framer Motion, Heroicons, and more.