Updated 1 hour ago

This is an experimental version of the Bubbles Design System, built with Figma Sites to explore its potential as a full documentation platform. It includes tests with Code Layers, AI-powered code generation (with Make), and a practical attempt at documenting everything directly inside Figma. Components and styles/variables are synced with Figma Design libraries to keep things consistent across tools. It's still a work in progress, but a good snapshot of what's possible.

Created with ❤️ for Figma ·

By Raúl Marín

·

Figma.camp

Resources

Access design patterns and module libraries that extend and support the entire system.

accessibility

A11y

Ensure your designs meet accessibility standards with clear guidance and best practices.

Components

Explore specs, usage guidelines, and behaviors for each UI component in the system.

Foundations

Understand the design principles, tokens, and visual language that form the foundation of the system.

2025 - Bubbles DS Experiment

Updated 1 hour ago

This is an experimental version of the Bubbles Design System, built with Figma Sites to explore its potential as a full documentation platform. It includes tests with Code Layers, AI-powered code generation (with Make), and a practical attempt at documenting everything directly inside Figma. Components and styles/variables are synced with Figma Design libraries to keep things consistent across tools. It's still a work in progress, but a good snapshot of what's possible.

Created with ❤️ for Figma ·

By Raúl Marín

·

Figma.camp

Foundations

Understand the design principles, tokens, and visual language that form the foundation of the system.

Components

Explore specs, usage guidelines, and behaviors for each UI component in the system.

A11y

Ensure your designs meet accessibility standards with clear guidance and best practices.

Resources

Access design patterns and module libraries that extend and support the entire system.

2025 - Bubbles DS Experiment

Updated 1 hour ago

This is an experimental version of the Bubbles Design System, built with Figma Sites to explore its potential as a full documentation platform. It includes tests with Code Layers, AI-powered code generation (with Make), and a practical attempt at documenting everything directly inside Figma. Components and styles/variables are synced with Figma Design libraries to keep things consistent across tools. It's still a work in progress, but a good snapshot of what's possible.

Created with ❤️ for Figma ·

By Raúl Marín

·

Figma.camp

Foundations

Understand the design principles, tokens, and visual language that form the foundation of the system.

Components

Explore specs, usage guidelines, and behaviors for each UI component in the system.

A11y

Ensure your designs meet accessibility standards with clear guidance and best practices.

Resources

Access design patterns and module libraries that extend and support the entire system.

2025 - Bubbles DS Experiment

Updated 1 hour ago

This is an experimental version of the Bubbles Design System, built with Figma Sites to explore its potential as a full documentation platform. It includes tests with Code Layers, AI-powered code generation (with Make), and a practical attempt at documenting everything directly inside Figma. Components and styles/variables are synced with Figma Design libraries to keep things consistent across tools. It's still a work in progress, but a good snapshot of what's possible.

Created with ❤️ for Figma ·

By Raúl Marín

·

Figma.camp

Foundations

Understand the design principles, tokens, and visual language that form the foundation of the system.

Components

Explore specs, usage guidelines, and behaviors for each UI component in the system.

A11y

Ensure your designs meet accessibility standards with clear guidance and best practices.

Resources

Access design patterns and module libraries that extend and support the entire system

2025 - Bubbles DS Experiment

Updated 1 hour ago

This is an experimental version of the Bubbles Design System, built with Figma Sites to explore its potential as a full documentation platform. It includes tests with Code Layers, AI-powered code generation (with Make), and a practical attempt at documenting everything directly inside Figma. Components and styles/variables are synced with Figma Design libraries to keep things consistent across tools. It's still a work in progress, but a good snapshot of what's possible.

Created with ❤️ for Figma ·

By Raúl Marín

·

Figma.camp

Foundations

Understand the design principles, tokens, and visual language that form the foundation of the system.

Components

Explore specs, usage guidelines, and behaviors for each UI component in the system.

A11y

Ensure your designs meet accessibility standards with clear guidance and best practices.

Resources

Access design patterns and module libraries that extend and support the entire system.