Skip to main content
  • Service design
  • Fluid Design System
  • Experience index
  • Resources
    • Figma
    • UX principles
    • Introduction
    • Angular
    • React
    • VueJs
    • Vanilla JS
    • Fluid Tokens
    • Fluid 4 deprecated
    • Dark Mode
  • Overview
  • Gradient Ray
  • Imagery
  • Logo
  • Pictograms
  • Vectors
  • Overview
  • Accessibility
  • Colors
  • Elevation
  • Iconography
  • Spacing
  • Typography
  • Roadmap
  • Whats new
Migrate v4 to v5

Design Tokens
  • Getting Started
  • Area charts
  • Bar charts
  • Line charts
  • Pie charts
  • Charts resources
  • Overview
  • Components status
  • Alert
  • Autocomplete
  • Avatar
  • Badge
  • Breadcrumb
  • Button
  • Card
  • Checkbox
  • Collapse
  • Dropdown
  • FAB
  • Footer
  • Form
  • Grid
  • Header
  • Icon
  • Icon button
  • Inline message
  • Input
  • Layout
  • Link
  • List
  • Modal
  • Navbar
  • Pagination
  • Progress
  • Radio button
  • Segmented control
  • Select
  • Sidebar
  • Slider
  • Spinner
  • Stamp
  • Status-indicator
  • Switch
  • Table
  • Tabs
  • Tag
  • Toast
  • Toggle
  • Tooltip
  • Borders
  • Clearfix
  • Colors
  • Display
  • Embed
  • Flex
  • Float
  • Image replacement
  • Overflow
  • Position
  • Screenreaders
  • Sizing
  • Shadows
  • Stretched link
  • Text
  • Vertical align
  • Visibility
Templates
Layouts
Support

Use the UP/DOWN arrows to navigate through the suggestion list. Press Enter to select an option. On touchscreen terminals, use swipe to navigate and double tap to select an option

keyboard_arrow_down
Link to Fluid's Microsoft Teams channel help Link to the support page

Brand overview

Our brand reflects who we are and the emotions our users have while using our products.

Fluid 5 is taking in the elements of the new ENGIE visual identity for 2023

Expect some changes as we iterate over the coming months.
For release updates and early access follow us on the teams channel.

remove

Gradient Ray

The gradient line is one of the foundation of ENGIE brand. This graphic element underlines the titles and bring brand identity to the interface.

image

Imagery

Images help establish a brand identity and support its overall values.

Logotype

The logo helps our users identify our brand when using our services. The ENGIE logo must be included in every digital interface created by ENGIE.

local_police

Pictograms

Pictograms Illustrates the themes presented in our various communications.

double_arrow

Vector

These geographical forms are fundamental to the brand. It represent urgency, action, acceleration, collective and transition.