Sylvain Girard

Design Engineer

Melbourne, Australia

Portrait of Sylvain Girard

Hi, I'm Sylvain Girard — a Design Engineer blending systems thinking, frontend craft, and motion detail to build cohesive brand and product experiences. I build token-driven design systems and interfaces that bring clarity, consistency, and emotion across platforms — from Webflow marketing sites to AI-enabled tools. Currently a Senior Digital Designer at IGNITE — Webflow sites and AI tools for clients and the internal team. Alongside this, freelance 3D and motion work brings products to life for fashion brands.

Get comfy, choose your theme
Send a messageHi Sylvain,

Melbourne

Light rain

32°C

Journal

  1. CSS · Layout

    Content that sizes itself

  2. CSS · Components

    Querying a component state

  3. CSS · Navigation

    Navigation that follows the scroll

  4. CSS · Positioning

    Anchored content that knows when to hide

  5. CSS · Values

    Branching and progress in CSS

  6. CSS · Patterns

    Counting siblings in CSS

  7. CSS · Patterns

    Randomness in CSS

  8. CSS · Scrolling

    A stateful scroll surface

  9. CSS · HTML

    Typed HTML attributes in CSS

  10. CSS · Layout

    Layout primitives in CSS

  11. CSS · Colour

    Colour relationships in CSS

  12. CSS · Controls

    Styling a native select

  13. CSS · Components

    Shapes and CSS functions

  14. CSS · Interaction

    Placement and scoped transitions

  15. CSS · Colour

    A colour axis with contrast

  16. CSS · Geometry

    Geometry with CSS

  17. CSS · Shape

    Shaping corners with superellipses

6:23PMAEDT

Work

  1. 36 Days of Type
  2. Image Suite
  3. 3D Work

Theme

Work

  1. Interactive 3D archive36 Days of TypeType a letter or number to explore an archive of rendered characters, then arrange them into a visual sentence.↗
  2. Living referenceDesign SystemExplore the foundations, controls and theme relationships behind this site.↗
  3. Image workflowImage SuiteA compact node canvas for connecting references, prompts and image operations.↗
  4. Information architectureSitemapShape a site’s structure, plan its content and compare the proposed pages with the original.↗
  5. CG & art direction3D WorkA visual archive of character, fashion and product worlds created through 3D and motion.↗
Back to launcher