{"id":24045,"date":"2023-03-29T15:46:02","date_gmt":"2023-03-29T22:46:02","guid":{"rendered":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/"},"modified":"2023-03-29T15:46:02","modified_gmt":"2023-03-29T22:46:02","slug":"modern-controls-coming-to-canvas-apps","status":"publish","type":"power-apps","link":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/","title":{"rendered":"Modern controls coming to canvas apps"},"content":{"rendered":"\n

Following on from the launch of the new look for model driven apps<\/a>, we\u2019re making the same modern controls available to canvas apps through an opt in preview. The new controls bring the following improvements:\u00a0<\/p>\n\n\n

  1. Modern<\/strong> \u2013 A focused and less cluttered design that supports richer interaction states and elevation, provides a higher usability baseline to build your low code apps from. These controls are based on Microsoft\u2019s own Fluent design system<\/a> which powers majority of Microsoft experiences across all products like Microsoft Teams, Word and more.<\/li><\/ol>\n\n\n
    1. Fast<\/strong> \u2013 Built for performance. We are making critical investments for this new suite to ensure your apps are fast and fluid.\u00a0<\/li>
    2. Accessible<\/strong> \u2013 These controls are WCAG 2.1 compliant with accessibility built in by default. We will provide a comprehensive set of properties for our developers to configure.\u00a0<\/li><\/ol>\n\n\n
      1. Theming<\/strong> \u2013 Designed with theming in mind. Although not part of the initial launch, support for theming and per control styling is coming to the preview soon.\u00a0<\/li><\/ol>\n\n\n

        Here is a look at side by side comparison<\/span> for the same app on new vs classic controls:<\/p>\n\n

        \"graphical<\/figure>\n\n
        \"graphical<\/figure>\n\n\n

        The preview will be updated frequently over the next few months. The goal is to provide a full suite of modern controls that are easy to style and fast. There are 13 new controls in the initial release.\u00a0<\/p>\n\n

        \"13<\/figure>\n\n\n

        We are far from done though.\u00a0 There are several awesome capabilities that we are going to be bringing over the coming weeks:\u00a0<\/p>\n\n\n

        1. Per control styling<\/strong> \u2013 color and font support that will work with the new theming system.\u00a0<\/li><\/ol>\n\n\n
          1. New theming system<\/strong> – We are introducing a new theming system that will allow you to customize the look and feel of apps with greater ease and flexibility.\u00a0\u00a0<\/li><\/ol>\n\n\n
            1. More controls<\/strong> \u2013 Lots more controls are on the way. There will be more atomic elements like toggle, breadcrumb, and multi-select dropdown, as well as updated form, gallery, and new composed controls.\u00a0<\/li><\/ol>\n\n\n
              1. Improved authoring & controls experience<\/strong> – We are making enhancements to the authoring experience, to make it much quicker and easier to build apps.<\/li><\/ol>\n\n\n

                How to enable this feature?<\/h2>\n\n\n

                Power Apps developers can turn on modern controls feature in Power Apps Studio by navigating to list of preview features in settings dialog.<\/p>\n\n

                \"Settings<\/figure>\n\n\n

                After turning the feature on, developers can view the list of controls on insert pane in left panel.<\/p>\n\n\n

                To learn more about modern controls, please see – Overview of modern controls.<\/a>\u00a0<\/p>\n\n\n

                If you have any questions or feedback about the model controls for canvas apps, please reach out to us. You can provide feedback to improve controls within Power Apps Studio or use community forum<\/a> to discuss with us and more community members.\u00a0<\/p>\n\n\n

                <\/p>\n","protected":false},"excerpt":{"rendered":"

                Following on from the launch of the new look for model driven apps, we\u2019re making the same modern controls available to canvas apps through an opt in preview. The new controls bring the following improvements:\u00a0 Modern \u2013 A focused and less cluttered design that supports richer interaction states and elevation, provides a higher usability baseline<\/p>\n","protected":false},"author":268,"featured_media":0,"comment_status":"open","ping_status":"open","template":"","power-apps-category":[1549,1551,1623,1656,1664],"power-apps-tag":[],"coauthors":[2229],"class_list":["post-24045","power-apps","type-power-apps","status-publish","hentry","power-apps-category-building-power-apps","power-apps-category-building-ui","power-apps-category-getting-started","power-apps-category-new-features","power-apps-category-uncategorized"],"yoast_head":"\nModern controls coming to canvas apps - Microsoft Power Platform Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Modern controls coming to canvas apps - Microsoft Power Platform Blog\" \/>\n<meta property=\"og:description\" content=\"Following on from the launch of the new look for model driven apps, we\u2019re making the same modern controls available to canvas apps through an opt in preview. The new controls bring the following improvements:\u00a0 Modern \u2013 A focused and less cluttered design that supports richer interaction states and elevation, provides a higher usability baseline\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/\" \/>\n<meta property=\"og:site_name\" content=\"Microsoft Power Platform Blog\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1-1024x594.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 min read\" \/>\n\t<meta name=\"twitter:label2\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data2\" content=\"Yogesh Gupta\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/\",\"name\":\"Modern controls coming to canvas apps - Microsoft Power Platform Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1-1024x594.png\",\"datePublished\":\"2023-03-29T22:46:02+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#primaryimage\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1.webp\",\"contentUrl\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1.webp\",\"width\":1939,\"height\":1124,\"caption\":\"graphical user interface, application, Teams\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Power Apps\",\"item\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Modern controls coming to canvas apps\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\",\"name\":\"Microsoft Power Platform Blog\",\"description\":\"Innovate with Business Apps\",\"publisher\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization\",\"name\":\"Microsoft Power Platform Blog\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png\",\"contentUrl\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png\",\"width\":194,\"height\":145,\"caption\":\"Microsoft Power Platform Blog\"},\"image\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Modern controls coming to canvas apps - Microsoft Power Platform Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/","og_locale":"en_US","og_type":"article","og_title":"Modern controls coming to canvas apps - Microsoft Power Platform Blog","og_description":"Following on from the launch of the new look for model driven apps, we\u2019re making the same modern controls available to canvas apps through an opt in preview. The new controls bring the following improvements:\u00a0 Modern \u2013 A focused and less cluttered design that supports richer interaction states and elevation, provides a higher usability baseline","og_url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/","og_site_name":"Microsoft Power Platform Blog","og_image":[{"url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1-1024x594.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"2 min read","Written by":"Yogesh Gupta"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/","name":"Modern controls coming to canvas apps - Microsoft Power Platform Blog","isPartOf":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#primaryimage"},"image":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#primaryimage"},"thumbnailUrl":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1-1024x594.png","datePublished":"2023-03-29T22:46:02+00:00","breadcrumb":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#primaryimage","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1.webp","contentUrl":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2023\/03\/Group-631027-1.webp","width":1939,"height":1124,"caption":"graphical user interface, application, Teams"},{"@type":"BreadcrumbList","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/modern-controls-coming-to-canvas-apps\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/"},{"@type":"ListItem","position":2,"name":"Power Apps","item":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/"},{"@type":"ListItem","position":3,"name":"Modern controls coming to canvas apps"}]},{"@type":"WebSite","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/","name":"Microsoft Power Platform Blog","description":"Innovate with Business Apps","publisher":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization","name":"Microsoft Power Platform Blog","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png","contentUrl":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png","width":194,"height":145,"caption":"Microsoft Power Platform Blog"},"image":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/"}}]}},"msxcm_display_generated_audio":false,"distributor_meta":false,"distributor_terms":false,"distributor_media":false,"distributor_original_site_name":"Microsoft Power Platform Blog","distributor_original_site_url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog","push-errors":false,"_links":{"self":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/24045","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps"}],"about":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/types\/power-apps"}],"author":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/users\/268"}],"replies":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/comments?post=24045"}],"version-history":[{"count":0,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/24045\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/media?parent=24045"}],"wp:term":[{"taxonomy":"power-apps-category","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps-category?post=24045"},{"taxonomy":"power-apps-tag","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps-tag?post=24045"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/coauthors?post=24045"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}