&
selection
Tttypography
typeface
Tt
size
/
leading
indent
em
tracking
em

weight
 
align
 
decor
 
caps
 
color & style
screen
layer
shadow
text
shadow
border
opacity
%
dimensions & layout
left
%
top
rem
width
%
height
rem
position
relative
 

min-width
px
max-width
px
display
block
vertical-align
default
float
none
margin & padding
margin
all
left
top
right
bottom

padding
all
left
top
right
bottom

transform
rotation
x
deg
y
deg
z
deg
transform
x
px
y
px
z
px

scale
x
=
y
view & breakpoints
display width
100%
zoom
1
pan
x: 0, y: 0

100 %
set a display width to add breakpoints
grid
display
column left
%
column width
%
gutter

baseline top
em
baseline height
em
css
layers
copy
delete
×
Sign Up to Add Fonts
document fonts
all fonts
×
Background
document colors
gradient
gradient
 
 
Add Color
Remove Color
options
gradient type
linear
angle
90
deg
center
x: 50
y: 50
%
position
x: 0
y: 0
%
tile x
100
%
tile y
100
%
border
style

all
left
top
right
bottom
radius
all

top left
top right
bot right
bot left
shadow
shadow type
outset
offset
x: 0 y: 0
blur
0 px
expand
0 px
red
R
green
G
blue
B
hue
H
sat
S
luma
L
alpha
alpha
A
#

Edit Room: Basic Principles

Respects your experience.

Edit Room feels as much as possible like working in a desktop image editing suite. Think photoshop + after effects, but radically simplified. Featuring intuitive key commands and modifiers for drawing and adjusting elements.

Your design work is the most important thing.

Designs are full-screen (full-window), and the controls are overlaid only when they're needed.

Instant Feedback for your changes.

Whatever property you adjust, the interface will disappear, just showing you the results of your changes. You only see feedback for the value you're changing echoed at the top of the screen.

Design with content in mind.

Edit Room forces a content-first and content-out design process. That doesn't mean content has to be final before starting design, but there should be a solid outline and a draft of some sort, that you can revise in the tool to refine your message.

Developer-friendly output.

Edit Room's exports are standards-compliant HTML and CSS. Markup and styles created are relatively clean. It's easy to hand-edit and add interactivity, javascript, forms, anything else, once the layout and visual design is complete. You can even extract portions of designs and paste them into other templates. It's totally up to you.

Don't try to do everything.

Edit Room doesn't include controls for every single possible CSS property. Focus on what’s most important to design: content, form, color, type, rhythm, and context.

Create an account today so you can save your own work!

You shouldn't be struggling with fixed-width desktop apps that don't even render fonts correctly. Start using Edit Room for your content, layout, and design work, and save time, prototype better, and share your work in progress with colleagues and clients.

Get started now.

?