Product updates

Brainstorm UI your future iPhone apps with the upcoming iOS 26 liquid glass concept. The UI kit comes with over 190 components in 15 categories along with wireframe templates.

Apple recently unveiled the beta of iOS 26 at WWDC, introducing a groundbreaking UI design language called Liquid Glass. Much like the early skeuomorphic design era and the later shift to flat UI, Liquid Glass marks a significant evolution in user interface design for iPhone apps.

This new aesthetic emphasizes translucency, fluid motion, and a glass-like visual texture that subtly blends UI elements into the background by allowing content to take center stage. It introduces a minimalistic approach to UI components, encouraging clarity, focus, and modern visual hierarchy.

Wireframe iOS 26 apps

Introducing the Complete Liquid Glass Wireframing Solution: 190+ Premium Components for iOS 26 Development

We're proud to announce the launch of our comprehensive wireframing component library, specifically designed for liquid glass application development. This powerful toolkit seamlessly integrates MockFlow's industry-leading wireframing platform with an extensive collection of 190+ pre-built liquid glass UI components, enabling designers and developers to accelerate their design workflow significantly.

Key Features & Benefits:

Our advanced wireframing solution empowers teams to rapidly prototype and visualize UI concepts, streamlining the design-to-development process. The intuitive interface facilitates quick iterations, allowing you to refine and finalize your design concepts before entering the development phase, ultimately reducing project timelines and costs.

Enhanced Development Workflow:

The integrated WireframePro build mode introduces seamless iOS SDK export functionality, providing developers with production-ready code that further accelerates development cycles. This feature bridges the gap between design and implementation, ensuring consistency and reducing manual coding requirements.

Availability & Access:

The complete Wireframe UI Kit for iOS 26 is now available at no cost to all users, making professional-grade wireframing tools accessible to teams of all sizes. Start designing your next liquid glass application today with our comprehensive component library.

Ready to transform your wireframing process? Access your free toolkit and begin creating exceptional user experiences.

MockStore now offers 300+ wireframe components for Tailwind v4 website designs and over 200 components tailored for Tailwind v4 web app wireframing.

There’s no doubt that Tailwind has become the most popular frontend CSS framework for building modern websites and web apps. If you’re developing with Tailwind, fast design iteration is essential. The new Tailwind v4 UI kit offers dedicated UI kits for both websites and web apps, giving you a huge range of components across multiple categories. This allows you to jumpstart your UI ideas and focus on functionality, without getting bogged down by styling from scratch.

Why it matters ?

If you’re a non-technical user or a manager, MockFlow now makes it effortless to visualize your layout ideas in Tailwind with no coding or prior experience required. You can easily create and experiment with UI designs, making the process as simple and accessible as possible.

Convert to code

Pair this with our Build Mode in WireframePro, and you can instantly convert your wireframe designs into ready-to-use Tailwind frontend code with just a single click.

Wireframe Components available in Tailwind v4 for website UI kit:

Its free for all

As with all UI kits in MockFlow, this release reflects our commitment to supporting the community. The Tailwind v4 Wireframe UI Kits are available to all users including those on the free basic plan, so you can start designing right away without any barriers.

1. Frames
2. Keypad
3. Top nav
4. Bottom nav
5. Buttons
6. Form elements
7. Tabs and Slider
8. Lists
9. Dialog boxes
10. Notification
11. Widgets
12. Icons
13. Popups
14. Misc elements

Android UI kit is available free for all MockFlow plans.

Brainstorm your SaaS apps mimicing shadcn look and feel.

shadcn/ui has quickly become a popular opensource library for building UI with reactjs. The reasons for its quick rise includes huge number of pre-built components, priority for accessibility and ease of use.

If you plan on developing web apps with shadcn, then it is important to brainstorm your UI ideas in its native look and feel to avoid implementation redesigns and to save time. With this new UI kit, MockFlow wireframing editor provides over 190 components in around 12 categories like forms, tables, alerts, charts.

With the easiness of MockFlow editor and extensible component set of this UI kit, you can draw UI mockups in minutes and iterate faster. Here is a sample UI screen for a dashboard was made with this UI pack in a matter of minutes.

For more information and installing the UI kit, Visit its MockStore page within the editor

Our latest feature enables you to copy styles alone from one component and effortlessly paste them into another component or multiple components. This will help to save you valuable time and make style updates a breeze.

Key Highlights:

1. Efficient Style Management: With the new Copy and Paste Styles feature, you can quickly replicate the styling of any component to others, ensuring consistency across your project.
2. Simple Shortcuts: To copy styles, use the shortcut Cmd+SHIFT+C. To paste styles, use Cmd+Shift+V. These shortcuts make the process swift and seamless.
3. Preserve Underlying Data: When you paste styles, the underlying data of the target component(s) remains intact. This ensures that only the appearance is modified, without affecting the content or functionality.
4. Enhanced Usability: This feature is designed to enhance the ease of use of MockFlow, making it more intuitive and user-friendly.

How It Works:

1. Select the Source Component: Click on the component from which you want to copy the styles.
2. Copy Styles: Press Cmd+SHIFT+C to copy the styles.
3. Select the Target Component(s): Choose one or multiple components where you want to apply the copied styles.
4. Paste Styles: Press Cmd+Shift+V to paste the styles onto the selected component(s).

We believe this new feature will be invaluable for maintaining visual consistency and speeding up your design process.

Stay tuned for more updates as we continue to bring enhancements for your wireframe needs. Thank you for being a valued user of MockFlow.

Happy Designing!

Quickly brainstorm your iPhone apps for iOS 18 with over 320 built-in components, including Apple Intelligence based elements.

Apple Inc. has announced the public preview of iOS 18, the forthcoming major version of the iPhone operating system, last week. It features big updates like new home screen layout, Apple Intelligence, UI updates and more...

With over 320 components in 16 categories and plus templates, MockFlow helps you ideate any iOS app that you can think of within minutes. Visualizing your mobile app ideas on how it looks with the new iOS will help you save time and effort before implementation.

Not just wireframes but also create UI flows for your app screens to depict operation flows within your app. And detailed design docs regarding your app idea with requirements, specs, outline. All within the same Project in the same Editor in MockFlow.

It is available for free in all plans.

Turn annotated design comments into resolved todo items with help of this new feature.

In the brainstorming stage, feedback from clients, team members, managers help shape up your wireframe design. Therefore it is important to keep track of them especially when comments are provided as an actionable task like "Use a light background image", "Reduce links in header", "Make the popup size smaller". Today's update helps to turn such actionable feedback into todo items with the new "Resolve" function.

Now completed actionable feedback can be marked as resolved. Once a comment is marked resolved, it disappears from the main list and can be found through filters. Also appropriate notifications are sent to project members about the comment.

This feature is available in all our plans including Free tier.

In today's update, we have overhauled design space insights with better graphics and more informative charts that speaks about your design projects.

Next to wireframing, MockFlow is known for its design project orgranization as it brings tools, files and members together under one roof. With design spaces, it is easy to organize, manage and share design projects just like a folder but better than that. Each design space comes with an insights button where it displays key information about what is happening in that space like top creators, project types, activity and more.

With just a click and a glance, check how your design space has evolved with your project and how your collaborators are involved. Space insights are useful in multiple cases like in agency-client relationship, client can have a better view of their agency's work progress. In a business related design space, it offers how their project uses different aspects of design to bring it together.

This is just the start, more features like activity timeline, AI related insights and integrations with regard to your design project organisation is coming soon to design spaces.

Introducing a new UI kit for Apple VisionOS with over 132 wireframe components.

Vision Pro is a next generation VR device from Apple. Long time after watch (first released in 2016), Apple is trying to establish entirely a new device line. Which means a new way on how users interact with the UI with altogether a different user experience. VisionOS that powers this device is built from ground up for AR and VR.

Like any other UI, straightforward implementation or prototyping of your application will only cost more time and resources. It also provides few opportunities to make decisions and choices. It is always better to wireframe your idea first to avoid these. UI kit for VisionOS helps with you bring out your ideas to picture and helps you to convey your layout, process, features even before implementation starts.

Here are some example UI screens that was created with this UI kit

Wireframe UI kit for Apple VisionOS is available for Free and can be accessed from within the MockFlow app. For more details visit MockStore link.

Sketchy or hand-drawn like wireframes convey in style that this UI design is not final and is unfinished. While MockFlow already provides several components and UI kits for drawing sketchy UI, Today we are introducing an exclusive UI kit with over 50 components for drawing hand-drawn like user interfaces just for Mobile devices.

It provides several elements that are commonly used in both iOS and Android UI frameworks like buttons, navigation, statusbar, keypad, device frames, lists, form inputs, popups and also example UI screens.

All great (mobile) software, start with an idea, now brainstorm your thoughts into drawings as fast as you think and as though you have drawn it on a piece of paper with this new UI kit.

It is now available in MockStore can be installed as a UI kit in your MockFlow WireframePro editor.

Now brainstorm your desktop app ideas for the latest MacOS 14 Sonoma using this newly released wireframe UI kit. There are totally over 160 components in 11 categories in this UI kit.

The wireframe UI kit for MacOS sonoma includes layouts of its latest features, theme and wallpapers. Some of the major highlights introduced in MacOS sonoma in addition to many subtle themes changes are : Widgets for Desktop, better messaging, and improved privacy features.

With the super-easiness of MockFlow Wireframing tool and the wide range of components included in this UI kit, brainstorming your UI ideas for the next generation MacOS is now a breeze.

This UI kit is available in all plans including Basic. For more information and using this wireframe kit, click here.

We are pleased to introduce "Generate Colors using AI," which is a new addition to the recently launched AI Co-Pilot. Like other tools in the co-pilot, this also helps users to brainstorm UI faster.

Colors are one of the key aspects when it comes to designing user interfaces. This tool helps to find the right colors for your UI with just a text prompt. Simply type "Best colors for Dark UI", "IBM brand colors", "Light green pastel palette". The system automagically generates colors based on the text prompt within a few seconds.

After the colors are listed, you can either copy the color code to your clipboard or directly favourite the color to the color picker of your current wireframe project.

MockFlow in keeping up with its promise to be up to date with the latest versions of all major UI frameworks, we are happy to release today - Wireframe UI kits for iPhone iOS 17 and iPadOS 17. iOS 17 is the next generation operating system and UI framework from Apple for its iPhone and iPad devices.

Now start brainstorming your mobile ideas for this upcoming OS using the latest UI components available for version 17.

iOS 17 wireframe components for iPhone

This UI pack includes over 240 components in 17 categories. The UI pack also includes pre-made designs of important screens like Home, Settings, Gallery...

iPadOS 17 wireframe components for iPad

The UI kit for iPad provides frames, status bars, keyboard, navigation components, buttons, form elements, and widgets. It has over 200 components in over 15 categories.

With MockFlow's rapid wireframing platform and iOS 17 UI kits, brainstorm, iterate and visualize your upcoming iPhone and iPad apps in little time.

Polaris is the design system for the Shopify admin. It includes components, icons and styles for developing high-quality merchant experiences in Shopify.

We are pleased to bring the power of brainstorming to ideate ecommerce apps with Shopify Polaris UI kit. This UI kit brings in over 140 components in 12 categories including buttons, form elements, cards, avatars, badges, modals and more...

To know more and install check here

Microsoft Fluent is a design system developed by Microsoft that aims to create a consistent and cohesive user experience across all Microsoft products and platforms. Fluent Design System 2, also known as Fluent 2, is an update and expansion of the original Fluent Design System.

Fluent 2 builds upon the principles and concepts of the original Fluent Design System, which include depth, motion, material, light, and scale. It introduces new design elements and enhancements to provide a more immersive and engaging user experience.

MockFlow has updated its Fluent wireframe UI kit for version 2 with 111 pre-built components spread over 12 categories. Now brainstorm your UI ideas for MS Fluent 2 at breakneck speed with the easy of MockFlow editor.

For more details visit this link - UI kit

Example wireframe created using this MS Fluent 2 wireframe kit

A new layout called 'PageFrame' theme has been added for SiteMap app. As the name indicates each node in the sitemap is encompassed in a browser frame like box. Like other themes in SiteMap app, each node can be customized for colors, thumbnails and node sections.

For those new to SiteMap in MockFlow, it offers a superfast way to plan and structure sitemap structures for your website. Also entire sitemaps can be generated with AI using just a prompt.

Here is the complete list of themes now available for SiteMap

In MockFlow, BYOC stands for "Bring Your Own Components." It is a feature that allows users to create and add their own custom design components using CSS and HTML to the MockFlow library, which they can then reuse in their designs.

These custom components can then be easily dragged and dropped into their wireframe projects, saving time and effort in the design process.

BYOC is particularly useful for design teams who need to maintain consistency across their projects or for individuals who have specific design requirements that are not met by the default components available in MockFlow.

Now with AI power, users can generate BYOC components with just a prompt.

Example Prompts:

• A curved blue button with white text
• Hero section with title and description
• A modal box with action buttons

The best part is any component generated with AI can be customised with code to make it perfect.

AI + BYOC is a perfect combination to save time on design projects that requires deep customization without much effort.

It is available now in both on our online and desktop editors. Try now!