LogoLogo
IntegrationsInstallationAdministrationContact Support
XMPro Platform
XMPro Platform
  • What is XMPro?
  • Getting Started
    • Browser Requirements
    • Free Trial
    • End-To-End Use Case
  • Resources
    • What's New in 4.4
      • What's New in 4.3
      • What's New in 4.2
      • What's New in 4.1.13
      • What's New in 4.1
      • What's New in 4.0
    • Blueprints, Accelerators & Patterns
    • Integrations
    • Sizing Guideline
    • Platform Security
    • Icon Library
    • FAQs
      • Implementation FAQs
      • Configuration FAQs
      • Agent FAQs
      • General FAQs
      • External Content
        • Blogs
          • 2024
            • How to Build Multi-Agent Systems for Industry
            • Why Solving the Problem Doesn’t Solve the Problem: The Importance of Scalable Intelligent Operations
            • Content, Decision, and Hybrid: The Three Pillars of Multi-Agent Systems in Industry
            • Revolutionizing Manufacturing with AI and Generative AI: XMPro’s Intelligent Business Operations Sui
            • The Evolution of Skills: Lessons from Agriculture in the GenAI and MAGS Era
            • Part 1: From Railroads to AI: The Evolution of Game-Changing Utilities
            • Part2: The Future of Work: Harnessing Generative Agents in Manufacturing
            • Bridging Automation and Intelligence: XMPro’s Approach to Industrial Agent Management
            • XMPro APEX: Pioneering AgentOps for Industrial Multi Agent Generative Systems
            • Part 5 – Rules of Engagement: Establishing Governance for Multi-Agent Generative Systems
            • How to Achieve Scalable Predictive Maintenance for Industrial Operations
            • Understanding the Difference Between XMPro AI Assistant and AI Advisor
            • Part 3 – AI at the Core: LLMs and Data Pipelines for Industrial Multi-Agent Generative Systems
            • MAGS: The Killer App for Generative AI in Industrial Applications
            • The Importance of Pump Predictive Maintenance for Operational Efficiency
            • Progressing Through The Decision Intelligence Continuum With XMPro
            • The Value-First Approach to Industrial AI: Why MAGS Implementation Must Start with Business Outcomes
            • New Guide – The Ultimate Guide to Multi-Agent Generative Systems
            • The Ultimate Guide To Predictive Analytics
            • Part 4 – Pioneering Progress | Real-World Applications of Multi-Agent Generative Systems
            • Scaling Multi-Agent Systems with Data Pipelines: Solving Real-World Industrial Challenges
          • 2023
            • How to master Predictive Analytics using Composable Digital Twins
            • Accelerate Your AI Workflow: The 3 Key Business Advantages of XMPro Notebook
            • The Roadmap to Intelligent Digital Twins
            • What is edge computing, and how can digital twins utilize this technology?
            • THE TOP 5 USE CASES FOR COMPOSABLE DIGITAL TWINS IN RENEWABLES + HOW TO SUPERCHARGE RESULTS WITH AI
            • The Technology Behind Predictive Maintenance (PdM) : Hardware & Software
            • The Benefits of Using Digital Twins in Smart Manufacturing
            • XMPro I3C Intelligent Digital Twins Strategy Framework
            • The TOP 5 use cases for composable digital twins in mining – and how to use AI to supercharge result
            • The TOP 5 use cases for Composable Digital Twins in the Oil & Gas industry
            • Why Decision Intelligence with Digital Twins is “kinda like” DCS for Automation and Control
            • XMPro becomes an NVIDIA Cloud-Validated partner
            • From Reactive to Predictive : Introduction to Predictive Maintenance
            • Microsoft Azure Digital Twins : Everything You Need To Know
            • Unlocking Efficiency: The Right Time & Strategy to Launch Your Digital Twin for Enhanced Asset Manag
            • Revolutionize Your Supply Chain: How Digital Twins Can Boost Efficiency and Cut Costs
          • 2022
            • Create a Common Operating Picture of Your Operations with XMPro
            • 7 Trends for Industrial Digital Twins in 2022
            • How to Build a Digital Twin + 60 Use Cases By Industry
            • What are composable digital twins in the metaverse?
          • 2021
            • The Value of a Composable Digital Twin
          • 2020
            • Lean Digital Twin: Part 2
            • Digital Twin: Your Most Productive Remote Worker
            • From the Control Room to the Bedroom
            • Lean Digital Twin: Part 3
          • 2019
            • My Digital Twin: Digital Twin Applications for Real-time Operations (Like Me)
          • 2018
            • XMPro IoT Operational Capability Survey Results 2018
            • What is a Digital Business Platform and Why Should I Care?
            • [Robotic] Process Automation for IoT
            • 3 Patterns of Industrial IoT Use Cases
            • The CXO’s Guide to Digital Transformation – May The Five Forces Be With You
            • Is Security More Important Than Trustworthiness for Industrial IoT?
            • XMPro at bpmNEXT 2018: Watch The Presentation
          • 2017
            • The Top 5 Reasons to Invest in an IIoT Development Platform
            • IoT Business Solutions Start with Big Data & Create Business Outcomes
            • How AI Bots Bring Digital Twins to Life
          • 2016
            • How To Get Started With Industrial IoT
            • How To Overcome The Top 5 Challenges To Industrial IoT Adoption
            • What is an IoT Platform vs. an IoT Business Application Suite?
            • Industrial IoT: How To Get Started with Predictive Maintenance
            • 3 Ways The Internet of Things is Transforming Field Service
            • 7 Types of Industrial IoT Data Sources (And How To Use Them)
          • 2015
            • How Important Are Processes To The Internet Of Things?
            • Understanding the Value of Real Time KPI Management as Your Next Strategic Project
            • 6 Myths About Machine Learning
            • 10 Predictive Analytics Use Cases By Industry
            • What is a “Business Moment” in your business?
            • Does Operational Intelligence Make Business Intelligence Obsolete?
            • How To Reduce Operational Costs by 36% with Predictive Analytics
            • From Many, One – The Nature of Complex Event Processing
            • Herding Cats: What Enterprise Architects need to know about Business Process Management
          • 2014
            • Making Business Operations More Intelligent
          • 2013
            • Best Next Action Is The Next Big Thing For Intelligent Operations
            • The learns from two ‘Best in class’ organisations acquiring BPM technology
          • 2012
            • Why Intelligent Business Operations is Mobile, Social and Smart
            • Why Do You Want Intelligent Business Operations?
            • How big of a problem are ‘dark processes’?
            • Operational Risk: When You Stick Your Head In The Sand
            • The Difference Between Event-based And Workflow-based Processes
          • 2011
            • Is mobile BPM now essential to the business?
            • Stretch Socially Dynamic Processes To Fit Your Business
            • Social Listening – Get Control Of The Conversation
            • Operations Management – The Keys To KPIs
            • Benefits of BPM v 1.0
            • How to Prioritise Processes
          • 2010
            • The Business Drivers
            • Preserving Capability and Agility
            • Mobile BPM
        • Use Cases
          • Aging Pipe Predictive Maintenance in Water Utilities
          • Air Quality Monitoring For Agriculture
          • Alarm Management and Triage
          • Asset Condition Monitoring for Surface Processing Plants in the Mining Industry
          • Bogie Health Monitoring in the Rail Industry
          • Boiler Feed Water Pumps
          • CHPP Throughput Loss Monitoring
          • Casting Guidance
          • Conveyor Belt System Monitoring and Optimization in Automotive Manufacturing
          • Cooling Tower Fin Fan Monitoring
          • Cyclone/Slurry Pump Monitoring
          • Demand Planning to Reduce Stockholding in Stores
          • Demin Water Monitoring for Boiler Tube Corrosion
          • EV Battery Assembly Process Optimization for the Car Manufacturing Industry
          • Flood Prediction & Response in Water Utilities
          • Golden Batch For Culture Addition In The Dairy processing Industry.
          • Golden Batch Monitoring
          • Improve First Pass Yield (FPY)
          • Induced Draft (ID) Fan Monitoring
          • Long Conveyor Monitoring
          • Monitor Process Health to Reduce Cash-to-Cash Cycle
          • Monitor Storm Water Reservoirs For Flood Prevention
          • Monitor and Reduce Energy Consumption
          • Oil Well Maintenance Planning
          • Oil Well RTP Monitoring
          • Pipe Scaling Prediction for Roller Cooling
          • Precision Irrigation in Agriculture
          • Predict Heat Exchanger Fouling
          • Predictive Maintenance & Asset Health Monitoring For Haul Trucks In The Mining Industry
          • Predictive Maintenance For Mobile Assets Within The Mining Industry
          • Predictive Maintenance for Robotic Arms in the Automotive Industry
          • Predictive Maintenance for Wind Turbines
          • Pump Health Monitoring in Water Utilities
          • Pumping Station OEE
          • Real-time Balanced Business Scorecard (BBS)
          • Real-time Safety Monitoring
          • Short Term Inventory Planning
          • Strategic Performance & Safety Oversight for Global Mining Operations
          • Wheel and Track Wear Monitoring In The Rail Industry
          • Wind Turbine Performance Optimization
        • Youtube
          • 2024
            • Discover Gen AI Powered Operations With XMPro iBOS
            • Generative AI and Digital Twins in 2024 - XMPro Webinar
            • Go From Reactive To Predictive Operations In Water Utilities With XMPro iDTS
            • How to add Timestamps to Elements in XMPro App Designer
            • How to Build an AI Advisor for Industrial Operations Using XMPro
            • How XMPro Stream Hosts and Collections Enable Scalable, Real-Time Data Processing
            • Mind Blowing AI Agentic Operations For Industry With XMPro MAGS
            • The Ultimate Beginner's Guide To Predictive Analytics Podcast
            • XMPro's Flexible Deployment Options: Flexible Cloud & On-Premise Solutions For Industry
            • XMPro iBOS: The Only AI-Powered Suite for Scalable Intelligent Operations
          • 2023
            • 2023 XMPro Product Roadmap - Webinar
            • An Introduction To Intelligent Digital Twins - Webinar
            • Energy and Utilities Asset Optimisation through Digital Twin technology
            • Explore Model Governance using our MLflow Agent
            • Exploring XMPro Notebook and MLflow for Data Science and Model Governance
            • How Changing Properties For One Block Can Be Applied To All Blocks Within Same Style Group
            • How do I Use A Button To Update a Data Source In XMPro App Designer
            • How Does XMPro Compare To ESBs (Enterprise Service Buses)-
            • How to Configure and Integrity Check in Data Streams
            • How To Create A Widget Within XMPro App Designer
            • How to Create Intelligent Digital Twins Using XMPro AI
            • How to export grid data to Excel In XMPro App Designer
            • How to Revolutionize Your Supply Chain with Digital Twins
            • How To Rotate Text In App Designer
            • How To Update a Data Source Using A Button
            • How To Use & Clone XMPro Demos For Your Own Use
            • How To Use And Build 3rd Party Apps To Extend The Capabilities Of The XMPro App Designer.
            • How to use Avatars and why they are important
            • How to view stream host logs In XMPro Data Stream Designer
            • Logging Provider Support With XMPro
            • Mastering Health Check Endpoints: A Guide to Ensuring Service Uptime and Performance with XMPro
            • Mastering Root Cause Analysis with XMPro: Capture, Value, Impact
            • Microsoft Azure Digital Twins Everything You Need To Know
            • Model Based Predictive Maintenance (PdM) With XMPro
            • Monthly Webinar - Accelerate your digital twin use cases - XMPro Blueprints, Accelerators & Patterns
            • Optimizing Time Series Chart (TSC) Performance
            • Predictive Maintenance & Condition Monitoring - A Hot Seat Q&A Session
            • Predictive Maintenance with XMPro iDTS
            • Smart Facilities Management with Intelligent Digital Twins
            • The Benefits of using Digital Twins in Smart Manufacturing
            • The Four Industrial Revolutions Explained In Under 4 Minutes! #industry4 #smartmanufacturing
            • The Roadmap To Intelligent Digital Twins
            • The Technology Behind Predictive Maintenance (PdM) - The Hardware & Software that makes PdM Tick...
            • THE TOP USE CASES FOR COMPOSABLE DIGITAL TWINS IN RENEWABLES
            • Tips on how to use cache in agent configuration and get live updates
            • Webinar - XMPro 4.3 Release Showcase
            • What is a Digital Twin- Why Composable Digital Twins is the Future.
            • What Is Predictive Maintenance- (PdM)
            • What To Do When a Data Source Is Not Showing in Pass Page Parameter
            • XMPro - The World's Only AI - Powered Intelligent Digital Twin Suite
            • XMPro - The World's Only No Code Digital Twin Composition Platform
            • XMPro AI : How It Works
            • XMPro AI End To End Use Case
            • XMPro Auto Scale - Understanding Distributed Caching for Cloud-Native Applications
            • XMPro Promo Video - Dell Validated Design For Manufacturing Edge
          • 2022
            • Aggregate Transformation Agent Example - XMPRO Data Stream Designer
            • App Layout Best Practices for Desktop & Mobile - XMPro Lunch & Learn
            • Broadcast Transformation Agent Example - XMPRO Data Stream Designer
            • Calculated Field Transformation Agent Example - XMPRO Data Stream Designer
            • CRC16 Function Agent Example - XMPRO Data Stream Designer
            • Create a Common Operating Picture of Your Operations with XMPro
            • CSV Context Provider Agent Example - XMPro Data Stream Designer
            • CSV Simulator Agent Example - XMPRO Data Stream Designer
            • CSV Writer Agent Example - XMPRO Data Stream Designer
            • Data Conversion Transformation Agent Example - XMPro Data Stream Designer
            • Digital Twin Strategy To Execution Pyramid - XMPro Webinar
            • Event Printer Action Agent Example - XMPRO Data Stream Designer
            • File Listener Agent Example - XMPRO Data Stream Designer
            • Filter Transformation Agent Example - XMPRO Data Stream Designer
            • Group & Merge Transformation Agent Example - XMPRO Data Stream Designer
            • How To Bind Data To A Chart and Get It Working As Expected - XMPro Lunch & Learn
            • How To Send Data To My App (Including Caching Introduction) - XMPro Lunch & Learn
            • Join Transformation Agent Example - XMPRO Data Stream Designer
            • Min/Max Function Agent Example - XMPRO Data Stream Designer
            • PART 1- How To Manage Complex Operations in Real-time Using Composable Digital Twins
            • PART 3 - How To Manage Complex Operations in Real-time Using Composable Digital Twins
            • PART2 - How To Manage Complex Operations in Real-time Using Composable Digital Twins
            • Pass Through Agent Example - XMPRO Data Stream Designer
            • Pivot Table Transformation Agent Example - Count - XMPRO Data Stream Designer
            • Pivot Table Transformation Agent Example - Sum - XMPRO Data Stream Designer
            • Real-Time Is Real - How To Use Event Intelligence Tools to Manage Complex Operations in Real-time.
            • Row Count Agent Example - XMPRO Data Stream Designer
            • Sort Transformation Agent Example - XMPRO Data Stream Designer
            • Transpose Transformation Agent Example - Columns - XMPRO Data Stream Designer
            • Transpose Transformation Agent Example - Rows - XMPRO Data Stream Designer
            • Trim Name Transformation Agent Example - XMPRO Data Stream Designer
            • Twilio Action Agent Example - XMPRO Data Stream Designer
            • Union Transformation Agent Example - XMPRO Data Stream Designer
            • Variables & Expressions in App Designer - XMPro Lunch & Learn
            • Window Transformation Agent Example - XMPRO Data Stream Designer
            • XML File Reader Action Agent Example - XMPRO Data Stream Designer
          • 2021
            • The Value of a Composable Digital Twin - XMPro Webinar
          • 2020
            • 1. Understanding The Problem - UX Design - XMPRO
            • 1.1 Welcome - XMPRO UI Design Basics
            • 1.2 Introduction To UI Design - XMPRO UI Design Basics
            • 2. Creating User Stories - UX Design - XMPRO
            • 2.1 Responsive Design - XMPRO UI Design Basics
            • 2.2 Grids - XMPRO UI Design Basics
            • 2.3 Visual Hierarchy - XMPRO UI Design Basics
            • 2.4 Wireframes - XMPRO UI Design Basics
            • 3. Creating User Flow Diagrams - UX Design - XMPRO
            • 3.1 Color Palette - XMPRO UI Design Basics
            • 3.2 Typography - XMPRO UI Design Basics
            • 3.3 White Space - XMPRO UI Design Basics
            • 3.4 UI Elements - XMPRO UI Design Basics
            • 4. Plan Your App with Wireframes - UX Design - XMPRO
            • 4.1 Chart Types - XMPRO UI Design Basics
            • 4.2 Chart Styling - XMPRO UI Design Basics
            • 5. Designing for Dynamic Data - UX Design - XMPRO
            • Agents and Their Types - XMPRO Data Stream Designer
            • Data Wrangling: Row Transpose - XMPRO Data Stream Designer
            • Digital Twin: Your Most Productive Remote Worker - XMPRO Webinar
            • End-To-End Real-Time Condition Monitoring Demo - XMPRO Application Development Platform
            • Error Endpoints - XMPRO Data Stream Designer
            • Export and Import Recommendations - XMPRO App Designer
            • How To Add Buttons To Agents - XMPRO Data Stream Designer
            • How To Add EditLists to Agents - XMPRO Data Stream Designer
            • How To Change UI Language - XMPRO Subscription Manager
            • How To Configure a Stream Object - XMPRO Data Stream Designer
            • How To Configure The Aggregate Transformation - XMPRO Data Stream Designer
            • How To Configure The Anomaly Detection Agent - XMPRO Data Stream Designer
            • How To Configure The Azure SQL Action Agent - XMPRO Data Stream Designer
            • How To Configure The Azure SQL Context Provider - XMPRO Data Stream Designer
            • How To Configure The Azure SQL Listener - XMPRO Data Stream Designer
            • How To Configure The Calculated Field Transformation - XMPRO Data Stream Designer
            • How To Configure The CSV Context Provider - XMPRO Data Stream Designer
            • How To Configure The CSV Listener - XMPRO Data Stream Designer
            • How To Configure The Data Conversion Transformation - XMPRO Data Stream Designer
            • How To Configure The Edge Analysis Transformation - XMPRO Data Stream Designer
            • How To Configure The Email Action Agent - XMPRO Data Stream Designer
            • How To Configure The Email Listener - XMPRO Data Stream Designer
            • How To Configure The Event Printer Action Agent - XMPRO Data Stream Designer
            • How To Configure The Event Simulator Listener - XMPRO Data Stream Designer
            • How To Configure The FFT Function - XMPRO Data Stream Designer
            • How To Configure The File Listener - XMPRO Data Stream Designer
            • How To Configure The Filter Transformation - XMPRO Data Stream Designer
            • How To Configure The IBM Maximo Action Agent - XMPRO Data Stream Designer
            • How To Configure The IBM Maximo Context Provider - XMPRO Data Stream Designer
            • How To Configure The IBM Maximo Listener - XMPRO Data Stream Designer
            • How To Configure The Join Transformation - XMPRO Data Stream Designer
            • How To Configure The JSON File Reader Context Provider - XMPRO Data Stream Designer
            • How To Configure The MQTT Action Agent - XMPRO Data Stream Designer
            • How To Configure The MQTT Advanced Action Agent - XMPRO Data Stream Designer
            • How To Configure The MQTT Advanced Listener - XMPRO Data Stream Designer
            • How To Configure The MQTT Listener - XMPRO Data Stream Designer
            • How To Configure The Normalize Fields Function - XMPRO Data Stream Designer
            • How To Configure The OSIsoft PI Context Provider - XMPRO Data Stream Designer
            • How To Configure The OSIsoft PI Listener - XMPRO Data Stream Designer
            • How To Configure The Pass Through Transformation - XMPRO Data Stream Designer
            • How To Configure The PMML Agent - XMPRO Data Stream Designer
            • How To Configure The REST API Context Provider - XMPRO Data Stream Designer
            • How To Configure The RScript Agent - XMPRO Data Stream Designer
            • How To Configure The Run Recommendation Agent - XMPRO Data Stream Designer
            • How To Configure The Signal Filter - XMPRO Data Stream Designer
            • How To Configure The SQL Server Action Agent - XMPRO Data Stream Designer
            • How To Configure The SQL Server Context Provider - XMPRO Data Stream Designer
            • How To Configure The SQL Server Listener - XMPRO Data Stream Designer
            • How To Configure The SQL Server Writer Action Agent - XMPRO Data Stream Designer
            • How To Configure The Twilio Action Agent - XMPRO Data Stream Designer
            • How To Configure The Union Transformation - XMPRO Data Stream Designer
            • How To Configure The Unzip Function - XMPRO Data Stream Designer
            • How To Configure The Window Transformation - XMPRO Data Stream Designer
            • How To Create an App - XMPRO App Designer
            • How To Create and Manage Templates - XMPRO App Designer
            • How To Create and Publish a Use Case - XMPRO Data Stream Designer
            • How To Create and Use a Widget - XMPRO App Designer
            • How To Create App Data Connections - XMPRO App Designer
            • How To Create App Pages and Navigation - XMPRO App Designer
            • How To Create Recommendation Rules - XMPRO App Designer
            • How To Create Recurrent Data Streams - XMPRO Data Stream Designer
            • How To Do Integrity Checks - XMPRO Data Stream Designer
            • How To Edit Page Properties - XMPRO App Designer
            • How To Enable Audit Trails - XMPRO App Designer
            • How to Export, Import, and Clone a Data Stream - XMPRO Data Stream Designer
            • How To Export, Import and Clone an App - XMPRO App Designer
            • How to Export and Import an App - XMPRO App Designer
            • How To Find Help for an Agent - XMPRO Data Stream Designer
            • How To Install The XMPRO App Designer
            • How To Maintain and Capture Notes - XMPRO App Designer
            • How To Manage Agents - XMPRO Data Stream Designer
            • How To Manage and Use Server Variables - XMPRO Data Stream Designer
            • How To Manage Buffer Size - XMPRO Data Stream Designer
            • How to Manage Categories - XMPRO App Designer
            • How To Manage Categories - XMPRO Data Stream Designer
            • How To Pass Parameters Between Pages - XMPRO App Designer
            • How To Publish and Share an Application - XMPRO App Designer
            • How To Set Up and Use Charts in Live View - XMPRO Data Stream Designer
            • How To Set Up and Use Gauges in Live View - XMPRO Data Stream Designer
            • How To Share a Data Stream - XMPRO Data Stream Designer
            • How To Share a Use Case - XMPRO Data Stream Designer
            • How To Share an App For Design Collaboration - XMPRO App Designer
            • How To Troubleshoot a Use Case - XMPRO Data Stream Designer
            • How To Upgrade a Stream Object Version - XMPRO Data Stream Designer
            • How To Use App Files - XMPRO App Designer
            • How To Use Application Versions - XMPRO App Designer
            • How To Use Bar Gauge - XMPRO App Designer
            • How To Use Calendar - XMPRO App Designer
            • How To Use Chart Pan, Zoom and Aggregation - XMPRO App Designer
            • How To Use Chart Panes and Axes - XMPRO App Designer
            • How To Use Chart Print and Export- XMPRO App Designer
            • How To Use Charts - XMPRO App Designer Toolbox
            • How To Use Charts: Series - XMPRO App Designer
            • How To Use Collections - XMPRO Data Stream Designer
            • How To Use Content Card - XMPRO App Designer
            • How To Use D3 - XMPRO App Designer
            • How To Use Data Sources - XMPRO App Designer
            • How To Use Embedded Pages - XMPRO App Designer Toolbox
            • How To Use Fieldset and Field - XMPRO App Designer Toolbox
            • How To Use Flex Layout
            • How To Use Form Validation - XMPRO App Designer Toolbox
            • How To Use Input Mappings - XMPRO Data Stream Designer
            • How To Use Linear Gauges - XMPRO App Designer
            • How To Use Live View - XMPRO Data Stream Designer
            • How To Use Lookup - XMPRO App Designer
            • How To Use Maps - XMPRO App Designer
            • How To Use Page Layers - XMPRO App Designer
            • How To Use Pivot Grid - XMPRO App Designer
            • How To Use Polar Charts - XMPRO App Designer
            • How To Use Power BI - XMPRO App Designer
            • How To Use Radio Buttons - XMPRO App Designer Toolbox
            • How To Use Recommendations - XMPRO App Designer Toolbox
            • How To Use Select Box - XMPRO App Designer
            • How To Use Stacked Layouts - XMPRO App Designer Toolbox
            • How To Use Stream Host Local Variables - XMPRO Data Stream Designer
            • How To Use Tabs - XMPRO App Designer Toolbox
            • How To Use Tags - XMPRO App Designer Toolbox
            • How To Use Templated List - XMPRO App Designer
            • How To Use Templates - XMPRO App Designer
            • How To Use Text - XMPRO App Designer Toolbox
            • How To Use Text Area - XMPRO App Designer Toolbox
            • How To Use The Accordion - XMPRO App Designer Toolbox
            • How To Use The Block Styling Manager - XMPRO App Designer
            • How To Use The Box and Data Repeater Box - XMPRO App Designer Toolbox
            • How To Use The Button - XMPRO App Designer Toolbox
            • How To Use The Circular Gauge - XMPRO App Designer Toolbox
            • How To Use The Data Grid - XMPRO App Designer Toolbox
            • How To Use The HTML Editor - XMPRO App Designer Toolbox
            • How To Use The Hyperlink and Box Hyperlink - XMPro App Designer Toolbox
            • How To Use The Image - XMPRO App Designer Toolbox
            • How To Use The Indicator - XMPRO App Designer Toolbox
            • How To Use The Layout Grid - XMPRO App Designer Toolbox
            • How To Use The Number Selector - XMPRO App Designer Toolbox
            • How To Use The Pie Chart - XMPRO App Designer Toolbox
            • How To Use The Range Slider - XMPRO App Designer Toolbox
            • How To Use The Recommendation Chart - XMPRO App Designer Toolbox
            • How To Use The Scroll Box - XMPRO App Designer Toolbox
            • How To Use The Select Box - XMPRO App Designer Toolbox
            • How To Use The Sparkline - XMPRO App Designer Toolbox
            • How To Use The Textbox - XMPRO App Designer Toolbox
            • How To Use Tree Grid - XMPRO App Designer
            • How To Use Tree List - XMPRO App Designer
            • How To Use Unity - XMPRO App Designer Toolbox
            • How To Use Variables - XMPRO App Designer
            • How To Write and Maintain Notes and Business Case - XMPRO Data Stream Designer
            • Interactive 3D Models For Digital Twins - XMPRO Event Intelligence Platform
            • Manage Input Arrow Highlights - XMPRO Data Stream Designer
            • Manage Recommendation Access - XMPRO App Designer
            • Realize Value from End-To-End Condition Monitoring in 6 - 8 Weeks - XMPRO
            • Recommendation Versions - XMPRO App Designer
            • Solution Development Process For Event Intelligence Apps - XMPRO
            • Stream Hosts and How To Install Them - XMPRO Data Stream Designer
            • Use Case Versioning - XMPRO Data Stream Designer
            • XMPRO App Designer Overview - Event Intelligence Applications
            • XMPRO Data Stream Designer - Event Intelligence Applications
            • XMPRO Real-Time Event Intelligence Demo
            • XMPRO Recommendations - Event Intelligence Applications
          • 2019
            • Data Distribution Service: Using DDS in Your IoT Applications
            • My Digital Twin: Digital Twin Applications For Real-Time Operations (Like Me)
            • Setting up a Typical Industrial IoT Use Case with XMPro
            • XMPro Overview & Fin Fan Failure Demo
          • 2016
            • XMPro iBPMS Overview
          • 2013
            • XMPro Best Next Action - 3 Examples for XMPro blog
            • XMPro Case Management Example
            • XMPro Internet of Things Demo
          • 2012
            • Is Agile Business the New Normal
            • The Future of BPM Moving Towards Intelligent Business Operations
            • What industries does XMPro serve-
            • Who is XMPro for-
            • XMPro - The Social Listener - Why You Should Be Listening.wmv
            • XMPro Cool Vendor 2012
            • XMPro iBPMS For SharePoint
            • XMPro iBPMS v6 XMWeb for Intelligent Business Operations
            • XMPro News and Gartner BPM Sydney Summit Discount Offer.mp4
            • XMPro Version 6 - Introducing the Next Generation BPM for Intelligent Business Operations
    • Practice Notes
      • Unified Recommendation Alert Management
      • Performant Landing Pages in Real-Time Monitoring
  • Concepts
    • XMPro AI
      • XMPro Notebook
    • Data Stream
      • Stream Object Configuration
      • Verifying Stream Integrity
      • Running Data Streams
      • Timeline
    • Collection and Stream Host
    • Agent
      • Virtual vs Non-Virtual Agents
    • Application
      • Template
      • Page
      • Block
      • Canvas
      • Page Layers
      • Block Styling
      • Devices
      • Flex
      • Block Properties
      • Data Integration
      • Navigation and Parameters
      • Variables and Expressions
      • App Files
      • Metablocks
    • Recommendation
      • Rule
      • Execution Order
      • Auto Escalate
      • Form
      • Action Requests
      • Notification
      • Recommendation Alert
      • Deleted Items
      • Scoring
    • Connector
    • Landing Pages & Favorites
    • Version
    • Manage Access
    • Category
    • Variable
    • Insights
      • Data Delivery Insights
  • How-To Guides
    • Data Streams
      • Manage Data Streams
      • Manage Collections
      • Use Remote Receivers and Publishers
      • Manage Recurrent Data Streams
      • Use Business Case and Notes
      • Run an Integrity Check
      • Check Data Stream Logs
      • Use Live View
      • Use Stream Metrics
      • Troubleshoot a Data Stream
      • Upgrade a Stream Object Version
      • Setup Input Mappings
      • Use Error Endpoints
      • Use the Timeline
      • Context Menu
    • Application
      • Manage Apps
      • Manage Templates
      • Manage Pages
      • Import an App Page
      • Design Pages for Mobile
      • Navigate Between Pages
      • Pass Parameters Between Pages
      • Page Data
      • Manage Connections
      • Check Connector Logs
      • Manage Data Sources
      • Use Data Sources in the Page
      • Use Dynamic Properties
      • Use Expression Properties
      • Use Page Layers
      • Use Block Styling and Devices
      • Use Flex
      • Use Validation
      • Use Variables & Expressions
      • Create and Maintain Notes
      • Manage Widgets
      • Manage App Files
      • Manage Themes
    • Recommendations
      • Manage Categories
      • Manage Recommendations
      • Manage Rules
      • Manage Notifications
      • Manage Notification Templates
      • Subscribe to Notifications
      • Manage Forms
      • Manage Variables
      • Manage Alerts
      • Manage Alerts on Mobile
      • Manage Deleted Recommendation Items
    • Connectors
      • Manage Connectors
      • Building Connectors
      • Packaging Connectors
    • Stream Host
    • Agents
      • Manage Agents
      • Building Agents
      • Packaging Agents
      • Debugging an Agent
    • Manage Versions
    • Manage Access
    • Manage Categories
    • Manage Variables
    • Import, Export, and Clone
    • Publish
      • Admin Unpublish Override
    • Manage Site Settings
    • Manage Landing Pages & Favorites
  • Blocks
    • Common Properties
    • Layout
      • Accordion
      • Box & Data Repeater Box
      • Card & Content Card
      • Field & Fieldset
      • Layout Grid
      • Menu
      • Scroll Box
      • Stacked Layout Horizontal & Vertical
      • Tabs
      • Templated List
      • Toolbar
    • Basic
      • Calendar
      • Check Box
      • Color Selector
      • Data Grid
      • Date Selector
      • Dropdown Grid
      • Embedded Page
      • File Library
      • File Uploader
      • Html Editor
      • Image
      • Indicator
      • List
      • Lookup
      • Number Selector
      • Radio Buttons
      • Range Slider
      • Select Box
      • Switch
      • Tags
      • Text
      • Text Area
      • Textbox
      • Tree Grid
      • Tree List
    • Device Input
      • Location Capture
      • Visual Media Capture
    • AI
      • Azure Copilot
      • ChatGPT Copilot
    • Actions
      • Box Hyperlink
      • Button
      • Data Operations
      • Hyperlink
    • Recommendations
      • Alert Action
      • Alert Analytics
      • Alert Discussion
      • Alert Event Data
      • Alert Form
      • Alert List
      • Alert Timeline
      • Alert Triage
      • Alert Survey
      • Recommendation Chart
    • Visualizations
      • Autodesk Forge
      • Azure Digital Twin Hierarchy
      • Bar Gauge
      • Chart
      • Circular Gauge
      • D3 Visualization
      • Esri Map
      • Image Map
      • Linear Gauge
      • Live Feed
      • Map
      • Pie Chart
      • Pivot Grid
      • Polar Chart
      • Power BI
      • Sparkline
      • Time Series Analysis
      • Tree Map
      • Unity
      • Unity (Legacy)
    • Advanced
      • Metablock
    • Widgets
  • Administration
    • Administrative Accounts
    • Language
    • Companies
      • Register a Company
      • Manage a Company
      • Manage Company Subscriptions
      • Manage License
    • Subscriptions
      • Manage User Access
      • Setup Auto Approval/Default Subscriptions
      • Request and Apply a License
    • Users
      • Invite a User
      • Register an Account
      • Profile
      • Change Password
      • Reset Password
      • Delete a User
      • Change Business Role
  • Installation
    • Overview
    • 1. Preparation
    • 2. Install XMPro
      • Azure
      • AWS
      • On-Premise
    • 3. Complete Installation
      • Configure Auto Scale (Optional)
      • Configure Health Checks (Optional)
      • Configure Logging (Optional)
      • Configure SSO (Optional)
        • SSO - Azure AD
        • SSO - ADFS
      • Create Base Company
      • Install Stream Host
        • Windows x64
        • Azure Web Job
        • Ubuntu 20.04 x64
        • Docker
      • Install Agents & Connectors
  • Release Notes
    • v4.4.18
    • v4.4.17
    • v4.4.16
    • v4.4.15
    • v4.4.14
    • v4.4.13
    • v4.4.12
    • v4.4.11
    • v4.4.10
    • v4.4.9
    • v4.4.8
    • v4.4.7
    • v4.4.6
    • v4.4.5
    • v4.4.4
    • v4.4.3
    • v4.4.2
    • v4.4.1
    • v4.4.0
    • Archived
      • v4.3.12
      • v4.3.11
      • v4.3.10
      • v4.3.9
      • v4.3.8
      • v4.3.7
      • v4.3.6
      • v4.3.5
      • v4.3.4
      • v4.3.3
      • v4.3.2
      • v4.3.1
      • v4.3.0
        • v4.2.3
        • v4.2.2
        • v4.2.1
      • v4.2.0
      • v4.1.13
      • v4.1.0
      • v4.0.0
Powered by GitBook
On this page
  • Style Groups
  • Devices
  • Style Sections
  • Dimension
  • Flex Layout
  • Typography
  • Decorations
  • Advanced Styling
  • Further Reading

Was this helpful?

Export as PDF
  1. Concepts
  2. Application

Block Styling

PreviousPage LayersNextDevices

Last updated 6 days ago

Was this helpful?

When a Block is selected, it can be styled under the 'Block Styling' tab in the Toolbox. Styling can include changing the text color, background color, borders, typography, or dimensions of the Block. This allows you to customize the look and feel of the application based on themes or color palettes for your specific organization. You can also customize the style of certain actions such as hovering over or clicking a button, or changing the style for every second Block.

Style Groups

A Block can also be assigned to a style group where a common set of styles can be configured and applied to multiple Blocks at the same time.

Certain Blocks such as content cards or cards that are dragged onto the canvas already have pre-existing style groups, such as grids. These will show up under the 'Style Group'.

If you have a Style Group selected and make changes to any of the styling configurations, the styling will automatically be applied to all the Blocks that are also in that style group. For example, if two grids have a style group called box-card, and you select only one of the grids and change the background to light blue, that change will also be applied to the other grid.

To make changes without affecting other blocks, deselect the style group and make the changes.

You can add multiple style groups at a time. If a Block has multiple style groups and you only want to apply styling to one of them, make sure only that style group is selected when configuring new styles.

If multiple style groups are selected and the styling is changed, the styling will be applied to both of them together. For example, if you have two style groups, box-card, and lightgreen, and you apply styling to both of them, that styling will only be applied to Blocks that have both box-card and lightgreen style groups.

Devices

Style Sections

Dimension

Style
CSS Property

Width

Height

Min Width

Min Height

Max Width

Max Height

Margin

Padding

  • fixed: px

  • relative: % and vh/vw

Flex Layout

Style
CSS Property

Direction

Justify

Align Items

Wrap

Grow

Align Self

Typography

Style
CSS Property

Font

Font size

Font Weight

Font Style

Line Height

Font Color

Text Align

Text Decoration

Word Spacing

Letter Spacing

Wrap Text

Sets whether text should be wrapped: Yes or No.

Wrap Text At

The options are Spaces, Capitals and Symbols, and Anywhere.

Decorations

Style
CSS Property

Background Color

The background of an element is the total size of the element, including padding and border (but not the margin).

Border Width

Border Style

Border Color

Border Radius

Add rounded borders to the corners of elements:

Background

  • Image (file or URL)

  • Repeat (repeat, repeat-x, repeat-y, no-repeat)

  • Position (left top, left center, left bottom, right top, right center, right bottom, center top, center center, center bottom,

  • Attachment (scroll, fixed, local)

  • Size (auto, cover, contain)

Advanced Styling

These styling options are rarely needed, but they provide additional flexibility for expert users.

Advanced position and displayed styling

Style
CSS Property

Display

Position

Top*

Right*

Left*

Bottom*

  • fixed: px

  • relative: % and vh/vw

Extra advanced styling

Style
CSS Property

Transition

  • Easing (linear, ease, ease-in, ease-out, ease-in-out)

Perspective

Z Index

Transform

  • rotateX() rotates an element around its X-axis at a given degree.

  • rotateY() rotates an element around its Y-axis at a given degree.

  • rotateZ() rotates an element around its Z-axis at a given degree.

  • scaleX() defines a 3D scale transformation by giving a value for the X-axis.

  • scaleY() defines a 3D scale transformation by giving a value for the Y-axis.

  • scaleZ() defines a 3D scale transformation by giving a value for the Z-axis.

Pointer Events

Cursor

Auto (default), Allowed, Help, None, Pointer, Progress, Wait, Zoom In, or Zoom Out. Note: Pointer Events must be set to All for the Cursor changes can be applied.

Advanced flex layout styling

Style
CSS Property

Flex Container

Shrink

Basis

Order

Typography advanced styling

Style
CSS Property

Text Shadow

Advanced decoration styling

Style
CSS Property

Overflow

Opacity

Box Shadow

Further Reading

Styles can also be configured for different devices.

.

.

.

.

.

.

When not using 'auto', the supported for the dimension properties are:

Recommended reading: and .

: Row, Row reverse, Column, or Column reverse.

: Start, End, Space between, Space around, or Centre.

: Start, End, Bottom, Stretch, Centre.

: No wrap, Wrap, Wrap reverse.

: Auto, Start, End, Bottom, Stretch, Centre.

: Arial, Arial Black, Brush Script MT, Comic Sans MS, Courier New, Georgia, Helvetica, Impact, Lucida Sans Unicode, Tahoma, Times New Roman, Trebuchet MS, Verdana

Either string or an integer along with a fixed (px) or relative (%, em, rem, vh, or vw) .

: Thin, Extra-Light, Light, Normal, Medium, Semi-Bold, Bold, Extra-Bold, or Ultra-Bold.

Normal, italic, or oblique.

using a fixed (px) or relative (%, em, rem, vw, or vh) .

by name, RGB, or RGBA.

: Left (default), Center, Right, or Justify.

: Underline, Strikethrough, or None (default).

(default normal).

(default normal).

Either string or an integer along with a fixed (px) or relative (%, em, or rem) .

by name, RGB, or RGBA.

in px or em.

in px or em.

in px or em.

in px or em.

: Solid, Dotted, Dashed, Double, Groove, Ridge, Inset, Outset, or None.

by name, RGB, or RGBA.

, each comprising:

block, inline, inline-block, flex (default), or none.

static (default), relative, absolute, or fixed.

(default auto).

(default auto).

(default auto).

(default auto).

The supported for properties marked with a * are:

, each comprising:

(all, width, height, background-color, transform, box-shadow, opacity)

how many seconds the effect lasts

A lower value will result in a more intensive 3D effect than a higher value.

:

: All (default) or None.

:

, each comprising an X position, Y position, and Blur (px or %) - as well as a Color (name, RGB, or RGBA).

: visible (default), hidden, scroll, or auto.

, where 1 is not at all transparent, 0.5 is 50% see-through, and 0 is completely transparent.

, each comprising an X position, Y position, Blur, and Spread (px or %) - as well as a Color (name, RGB, or RGBA) and Shadow Type (Outside, Inside).

See the Devices article for more details on devices.
css units
Flex
How to Use Flex
css units
How to use Block Styling and Devices
How to use Flex
width sets the width of an element
height sets the height of an element
min-width defines the minimum width of an element
min-height defines the minimum height of an element
max-width defines the maximum width of an element
max-height defines the maximum height of an element
margin-top sets the top margin of an element.
margin-right sets the right margin of an element.
margin-bottom sets the bottom margin of an element.
margin-left sets the left margin of an element.
padding-top sets the top padding (space) of an element.
padding-right sets the right padding (space) of an element.
padding-bottom sets the right padding (space) of an element.
padding-left sets the right padding (space) of an element.
flex-direction specifies the direction of the flexible items
justify-content aligns the flexible container's items when the items do not use all available space on the main-axis (horizontally)
align-items specifies the default alignment for items inside the flexible container
flex-wrap specifies whether the flexible items should wrap or not
flex-grow is an integer that specifies how much the item will grow relative to the rest of the flexible items inside the same container.
align-self specifies the alignment for the selected item inside the flexible container
font-family specifies the font for an element
font-size sets the size of a font.
css unit
font-weight sets how thick or thin characters in text should be displayed
font-style specifies the font style for a text.
line-height specifies the height of a line
css unit
color specifies the color of text
text-align specifies the horizontal alignment of text in an element
text-decoration specifies the decoration added to the text
word-spacing increases or decreases the space in pixels between words in a text
letter-spacing increases or decreases the space between characters in a text
css unit
background-color sets the background color of an element
border-top-width sets the width of an element's top border
border-right-width sets the width of an element's right border
border-bottom-width sets the width of an element's bottom border
border-left-width sets the width of an element's left border
border-style sets the style of an element's four borders
border-color sets the color of an element's four borders
border-top-left-radius defines the radius of the top-left corner.
border-top-right-radius defines the radius of the top-right corner.
border-bottom-left-radius defines the radius of the bottom-left corner.
border-bottom-right-radius defines the radius of the bottom-right corner.
background adds one or more image layers
display specifies the type of rendering box of an element:
position specifies the type of positioning used for an element:
top sets the vertical position of a positioned element
right sets the horizontal position of a positioned element
left sets the horizontal position of a positioned element
bottom sets the vertical position of a positioned element
transition adds one or more transition effect layers
transition-property
transition-duration
perspective defines how far the object is away from the user.
z-index specifies the stack order of a positioned element.
Apply 3D mouseover effects to transformable elements
pointer-events defines whether or not an element reacts to pointer events
cursor
sets the mouse cursor, if any, to show when the mouse pointer is over an element
flex-container enables all flexible items be the same length, regardless of content.
flex-shrink is an integer that specifies how the item will shrink relative to the rest of the flexible items inside the same container.
flex-grow is an integer that specifies how much the item will grow relative to the rest of the flexible items inside the same container.
order is an integer that specifies the order of a flexible item relative to the rest of the flexible items inside the same container.
text-shadow adds one or more layers to the text
overflow sets the desired behavior when content does not fit in the parent element box (overflows) in the horizontal and/or vertical direction
opacity sets the transparency of an element
box-shadow adds one or more shadow layers to an element