Explore the main features of this powerful tool.
Trillion ways to Improve Workflow
Designed with professional designers and developers in mind, the streamlined interface and workflow helpers will let you create a truly unique workflow. Every part of the interface is configurable because one size does not fit all.
- Flexible Panels: Both panels support the option to adjust the default width. If you need more space, drag the panel to change the current width. No jumping when you change the panel, the panel only resizes if you want it to.
- Unmatched UI Flexibility: Optimize for a large screen, or make it compact. Dock panels, pick one of the 10 themes. Workspace offers 40+ customization to ensure Workflow that meets user needs.
- User Profiles: The client and every developer in the team work on different screens, they have different quality of eyesight. Workspace supports individual profiles so that each team member can configure the interface according to their own preferences.
Shortcuts Crafted to Adopt
Shortcuts system that is crafted for a high adoption rate of shortcuts. The system provides a few levels of adoption boosters so you can reduce the learning curve which is needed to adopt most of them.
- Two-Handed Workflow: This workflow distributes muscle movements evenly across both hands, resulting in fewer clicks, reduced mouse travel, and reduced mouse keyboard. Keep hands in the right place.
- Guided Shortcuts: Having 50+ shortcuts, but using only a few of them? We don't develop shortcuts to have, we make them for use. Enable shortcuts hints and have visual clues so you can adopt
- 40+ Shortcuts: Jump between breakpoints, panels, and advanced tabs, activate certain features, and add elements. We have covered everything you need.
Actions inside Oxygen (CLI).
According to 27% of users, this is the most loved feature inside Recoda Workspace. Actions provide an unseen way of interacting with Website creation Software, instead of clicking and going through the interface, you have one input where you can do 70% of the most common things.
- Add Multiple Classes: This workflow distributes muscle movements evenly across both hands, resulting in fewer clicks, reduced mouse travel, and reduced mouse keyboard. Keep hands in the right place.
- Bulk Actions: Import classes in a bulk, bulk HTML tags change, bulk rename elements. Add multiple classes to multiple elements, saving time.
- Emmet-Like Adding Elements: Instead of adding elements via an interface, and changing tags, you can write Emmet-like syntax which will add elements and change tags for you.
Designer Favorite Tools
Easily recreate designs from Figma to the real site using customizable Grid Guides to align layout according to design, evaluate design at the lower fidelity and inspect layout problems using X-mode, and quickly check responsiveness using Responsive Helpers.
- Grid Guides: Grid Guide helpers offer you to have a fronted debug tool to evaluate your design.
You can customize everything at every breakpoint, so it fits with the grid system from Figma design and makes it easier to transfer the desired design to a real website - X-mode: It is a grayscale view of your site's canvas that visually displays each element's border. Grayscale helps you evaluate layout at lower fidelity, and border outline on the other side helps you evaluate space between elements and catch elements that are breaking desired design flow.
- Responsive: Its helpers' extension gives users the ability to simulate various devices. You can pick some preset values or enter your custom value and see how your design looks at that size.
Other Features
- Custom CSS: Custom-made solution to hint CSS properties and options in no-selector mode while writing Custom CSS inside Oxygen Builder. Supports Intelligent CSS properties hints and CSS variables hints.
- Editor: When low-code meets the full code. Use CSS Variables like never before, supports CSS variables hints in Editor fields while you are typing.
- Stylesheet: Turn Oxygen Builder stylesheets into an IDE-like experience. Supports Oxygen classes hints, CSS variables hints, and Intelligent CSS properties hints.
