Trillion ways to Improve Workflow.
Designed with professional designers and developers in mind, the streamlined interface and workflow helpers will let you to create truly unique workflow. Every part of 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 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 eye sight. 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 high adoption rate of shortcuts. System provides few levels of the adoption boosters so you can reduce learning curve which is needed to adopt most of them.
Two-Handed Workflow
This workflow distributes muscle movements evenly across both hands, resulting in less clicks, reduced mouse travel, and reduced mouse-keyboard. Keep hands at the right place.
Guided shortcuts
Having 50+ shortcuts, but using only few of them? We don't develop shortcuts to to have, we make them for use. Enable shortcuts hints and have visual clue so you can adopt
40+ shortcuts
Jump between breakpoints, panels, advanced tabs, activate certain features, add elements. We have covered everything you need.
Optimized for Every Workstation
Notebook users usually suffer from a lack of horizontal space. Recoda Workspace allows using the interface in three tabs (Editor, Live Server and Stylesheets), reducing the width of the both panels, and using the buttons of the advanced panels in vertical orientation with the possibility of reducing the spacing between elements in the structure panel.
Notebook users usually suffer from a lack of horizontal space. Recoda Workspace allows using the interface in three tabs (Editor, Live Server and Stylesheets), reducing the width of the both panels, and using the buttons of the advanced panels in vertical orientation with the possibility of reducing the spacing between elements in the structure panel.
Most applications are not adapted to Widescreen monitor users. The users of such monitors are in difficulty because they have increased mouse travel between the panels. In addition to adjusting the size of the panel, and setting the default value of the panel width, Recoda Workspace enables the rearrangement of panels to significantly reduce mouse travel.
Multi-monitor users often cannot use the full potential of the hardware equipment because most applications are not structured for such a way of use. Recoda Workspace has sub-applications that allow you to unlock its full potential. On one monitor the user can have a Live Server (opened frontend of the website with hot-reload and Scroll Sync with Editor inside Oxygen Builder), on another open Oxygen Builder, and on the third monitor have Stylesheets with the instant reflection of changes.
Actions inside Oxygen (CLI).
According to 27% of users, this is the most loved feature inside Recoda Workspace. Actions provides 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
You can add multiple classes quickly, and it is connected with Codesense so you will have hints for all Oxygen classes while you are typing.
Bulk actions
Import classes in a bulk, bulk HTML tags change, bulk rename elements. Add multiple classes to multiple elements, save time.
Emmet-like adding elements
Instead of adding elements via 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 real site using customizable Grid Guides to align layout according to design, evaluate design at the lower fidelty and inspect layout problems using X-mode, quickly check responisvness using Responsive Helpers.
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 is 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 which are breaking desired design flow.
Responsive 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.
Code like never before.
powered by Recoda Codesense
Recoda Codesense is set of the custom CodeMirror integrations with Oxygen builder to have the best code writing experience inside Oxygen Builder. It is the most powerful solution inside any page-builder to turn builder close to the desktop IDE.
Cheat layer for coding
Part of the Codesense are extensions for intelligent CSS hinting, finding all the CSS variables and all the Oxygen classes. Codesense stands out with ability to work in no-selector mode (Oxygen Custom CSS) and hint like you are writing in normal mode.
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 in IDE like experience. Supports Oxygen classes hints, CSS variables hints and Intelligent CSS properties hints.