Skip to content

LANGUAGE V1 · FROZEN REFERENCE

Example library

2,000 results · Page 88 of 167

multipage-apps

Serein · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0045
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Serein" with font size 22 pixels, font weight 800, text color #b45309.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #b45309, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 45" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #b45309, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Serein" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #b45309, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 45" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #b45309, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Atlas · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0046
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Atlas" with font size 22 pixels, font weight 800, text color #4338ca.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #4338ca, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 46" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #4338ca, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Atlas" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #4338ca, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 46" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #4338ca, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Nocturne · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0047
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Nocturne" with font size 22 pixels, font weight 800, text color #047857.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #047857, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 47" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #047857, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Nocturne" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #047857, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 47" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #047857, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Cedar · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0048
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Cedar" with font size 22 pixels, font weight 800, text color #c026d3.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #c026d3, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 48" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #c026d3, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Cedar" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #c026d3, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 48" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #c026d3, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Forma · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0049
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Forma" with font size 22 pixels, font weight 800, text color #0369a1.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #0369a1, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 49" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #0369a1, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Forma" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #0369a1, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 49" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #0369a1, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Morrow · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0050
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Morrow" with font size 22 pixels, font weight 800, text color #4f46e5.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #4f46e5, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 50" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #4f46e5, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Morrow" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #4f46e5, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 50" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #4f46e5, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Halcyon · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0051
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Halcyon" with font size 22 pixels, font weight 800, text color #7c3aed.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #7c3aed, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 51" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #7c3aed, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Halcyon" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #7c3aed, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 51" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #7c3aed, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Orbit · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0052
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Orbit" with font size 22 pixels, font weight 800, text color #2563eb.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #2563eb, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 52" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #2563eb, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Orbit" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #2563eb, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 52" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #2563eb, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Monument · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0053
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Monument" with font size 22 pixels, font weight 800, text color #0f766e.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #0f766e, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 53" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #0f766e, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Monument" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #0f766e, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 53" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #0f766e, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Kindred · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0054
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Kindred" with font size 22 pixels, font weight 800, text color #be123c.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #be123c, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 54" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #be123c, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Kindred" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #be123c, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 54" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #be123c, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Juniper · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0055
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Juniper" with font size 22 pixels, font weight 800, text color #b45309.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #b45309, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 55" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #b45309, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Juniper" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #b45309, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 55" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #b45309, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.
multipage-apps

Solace · Multi-page application

40 lines · 3 pages · Frontend only

FormsInteractionsResponsive
View code v1-multipage-apps-0056
Create page home containing home_nav, hero with viewport fill, background white, padding 28 pixels, gap 24 pixels.
Create navigation home_nav containing home_brand, about_link, contact_link with direction horizontal, distribution between, alignment center.
Create heading home_brand displaying "Solace" with font size 22 pixels, font weight 800, text color #4338ca.
Create button about_link displaying "About" with background transparent, text color #0f172a, padding 10 pixels.
When about_link is clicked, navigate to about.
Create button contact_link displaying "Contact" with background #4338ca, text color white, padding 10 pixels, border radius 8 pixels.
When contact_link is clicked, navigate to contact.
Create section hero containing hero_title, hero_copy, hero_action with alignment center, distribution center, gap 16 pixels, minimum height 560 pixels.
Create heading hero_title displaying "Build a clearer path forward 56" with font size 48 pixels, text alignment center, maximum width 760 pixels.
Create text hero_copy displaying "Strategy, design, and delivery for ambitious teams." with font size 18 pixels, text alignment center.
Create button hero_action displaying "Meet the studio" with background #4338ca, text color white, padding 13 pixels, border radius 9 pixels.
When hero_action is clicked, navigate to about.
Create page about containing about_title, about_copy, values, about_back with viewport fill, background #f8fafc, padding 36 pixels, gap 24 pixels.
Create heading about_title displaying "About Solace" with font size 38 pixels.
Create text about_copy displaying "We combine research, systems thinking, and careful execution." with font size 18 pixels, maximum width 720 pixels.
Create container values containing value_one, value_two, value_three with layout grid, grid columns 3, gap 16 pixels.
Create card value_one containing value_one_title, value_one_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_one_title displaying "Clarity" with font size 20 pixels.
Create text value_one_copy displaying "Make the important thing obvious.".
Create card value_two containing value_two_title, value_two_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_two_title displaying "Care" with font size 20 pixels.
Create text value_two_copy displaying "Sweat details users can feel.".
Create card value_three containing value_three_title, value_three_copy with padding 20 pixels, background white, gap 8 pixels.
Create heading value_three_title displaying "Momentum" with font size 20 pixels.
Create text value_three_copy displaying "Turn decisions into working outcomes.".
Create button about_back displaying "Back home" with background #4338ca, text color white, padding 10 pixels.
When about_back is clicked, navigate to home.
Create page contact containing contact_title, contact_form, contact_back with viewport fill, background #0f172a, text color white, padding 36 pixels, gap 20 pixels.
Create heading contact_title displaying "Start conversation 56" with font size 38 pixels, text color white.
Create form contact_form containing email_input, message_input, send_button with direction vertical, gap 12 pixels, maximum width 640 pixels.
Create input email_input with placeholder "Email address".
email_input input type is email.
email_input is required.
Create textarea message_input with placeholder "Tell us about the project".
message_input is required.
Create button send_button displaying "Send inquiry" with background #4338ca, text color white, padding 12 pixels.
send_button submits form.
Create button contact_back displaying "Back home" with background transparent, text color white, padding 10 pixels.
When contact_back is clicked, navigate to home.
On screens below 720 pixels, values grid columns is 1.