Hola

Bonjour

Hello

Fluid responsive

We wanted to create a tool that is easy to set up when you start a project that allows you to perfectly respect the design made and to answer accessibility problems simultaneously. Here is the video tutorial

Desktop icon

Desktop

prototype values

Px

Px

Px

prototype minimum values

Px

Px

Px

My container max-width is wider than my prototype width

prototype maximum values

Px

Px

Px

Tablet icon

Tablet

I don't need this breakpoint

Prototype maximum values

Px

Px

Px

prototype minimum values

Px

Px

Px

Mobile icon

Mobile

I don't need this breakpoint

Prototype maximum values

Px

Px

Px

prototype minimum values

Px

Px

Px

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Copy and past this code in the embed at the top of the page

<style> 
html { font-size: 16px;}

@media (min-width: px) {
   html {font-size: calc(px +  * ((100vw - px) / ));}
}

@media (min-width: px) {
   html {font-size: calc(px +  * ((100vw - px) / ));}
}

@media (min-width: px) {
   html {font-size: calc(px +  * ((100vw - px) / ));}
}

@media (min-width: px) {
   html {font-size: px;}
}

.container {
   max-width: rem;
}


@media (min-width: px) {
   html {font-size: calc(px +  * ((100vw - px) / ));}
}

@media (min-width: px) {
   html {font-size: px;}
}

.container {
   max-width: rem;
}
</style>