global-raw-tokens

The OUDS Global Raw Tokens module serves as the single source of truth for all primitive design values of the Orange Unity Design System. It contains the "atomic" definitions of the brand style (Hex codes, pixel values, font files) without any context or semantic meaning.

These tokens act as the ingredients used to build the semantic OudsTheme defined in the core module. They are automatically generated by Tokenator.

Purpose

This module is strictly a dictionary of values.

• Context-Agnostic: A raw token like Orange500 always refers to the exact same hex code #FF7900, regardless of whether the app is in Light or Dark mode.

• Immutable: These values represent the fixed brand guidelines and should not be altered at runtime.

Token Categories

Package: com.orange.ouds.tokens.global.raw

The raw tokens are organized into categories representing the fundamental properties of the design system.

1. Raw Borders

Contains primitive values for corner radiuses and border widths.

2. Raw Colors

Contains the complete definition of the OUDS color palette (e.g., Orange, Blue, Green, Grey scales).

• Format: ColorName + Shade (e.g., ColorFunctionalAmethyst400, ColorFunctionalAmethyst600, ColorFunctionalGrayDark80).

• Value: Hardcoded Hex values (0xffa885d8).

3. Raw Dimensions

Contains primitive spacing and sizing units.

• Format: Dimension + Scale (e.g., Dimension100, Dimension200).

• Value: Density-independent pixels (dp).

4. Raw Effects

Contains various visual effects applied to components, such as blurs.

• Format: Effect + Scale (e.g., EffectBlur160).

• Value: Parameters defining the visual distortion or filter applied.

5. Raw Elevations

Contains the primitive definitions for depth and shadow effects.

• Format: Elevation + Level (e.g., Elevation0, Elevation5).

• Value: Combinations of shadow colors, offsets, and blur radiuses often mapped to standard dp elevations.

6. Raw Grids

Contains the primitive layout grid definitions used to structure the UI.

• Format: Grid element + Scale (e.g., GridMargin100) or Grid element + Window Size (e.g., GridMaxWidthCompact).

• Value: Columns count, margin sizes, and gutter widths tailored for specific breakpoints.

7. Raw Opacities

Contains primitive alpha transparency values.

• Format: Opacity + Level (e.g., Opacity100, Opacity500).

• Value: Float values ranging from 0.0 (transparent) to 1.0 (opaque).

8. Raw Typography

Contains the definitions of basic text properties.

• Format: Property + Scale (e.g., FontLineHeight100, FontSize200).

• Value: Primitive values for font sizes, line heights, font weights, and letter spacing.

Usage Guidelines

⚠️ Important: As an application developer, you should rarely, if ever, use this module directly.

Raw vs. Semantic

The core philosophy of OUDS is to separate the Value (Raw) from the Usage (Semantic).

When to use this module?

You should only access global-raw-tokens in the following advanced scenarios:

1. Defining Semantic Tokens: When you are creating a custom theme implementation, you map these Raw tokens to Semantic slots (e.g., assigning Orange500 to brand.primary).

2. Creating Custom Components: If you are building a highly specific component that cannot be achieved with standard semantic tokens (rare), you might need to reference a raw value to stay within brand guidelines.

Tokens versions

This module is generated based on specific versions of the design system definitions. It ensures traceability between the design specifications and the implementation.

🤖 Note: Files in this module are automatically generated by Tokenator based on the design definitions.

Any manual changes to these files will be lost during the next synchronization.