Generates Presto Dom Code from Sketch Layers.

v2.2.0 is compatible with Sketch 3.0.0


A Sketch plugin that copies selected layers to the clipboard as code that can be pasted straight into a UI .purs file.

  • Copy one or more layers
  • Layers are copied in position
  • Text, group and rectangle layers are turned entirely in code
  • Image layers too are generated and exported @3x


Download or clone the repository, and double click Presto-Dom-Gen.sketchplugin.

What layer types can the plugin handle?


Here is an example of the code that will be generated when you select a rectangle showing the full set of properties that can be generated:

  [ height $ V 100 
  , width $ V 200
  , background "#FF18294E"
  , stroke "1,#FFFFFFFF"
  , cornerRadius 4


Text is copied as a native text layer:

  [ height $ V 19 
  , width $ V 235
  , text "There’s a lot to share with others…"
  , fontStyle "Gilroy-Medium"
  , textSize 16
  , color "#9B9B9B"
  , letterSpacing (-0.33)


Groups are copied as native linearLayout:

  [ height $ V 300
  , width $ V 400

What layer styles can the plugin handle?

  • Opacity
  • Background
  • Border
  • CornerRadius
  • FontStyle, FontSize, FontWeight
  • Height, Width
  • Gravity
  • ImageUrl
  • Text
  • Kerning

How include image assets

When the design of a layer cannot be represented using native code you will need to use an image asset:

  [ height $ V 200 
  , width $ V 200
  , imageUrl "avatar"

Here’s how:

  1. Select the layer in Sketch and press 'CMD SHIFT P'

  2. Enter the ImageUrl and press ok, it will be used to generate the asset naming and in generation imageView -> imageUrl.

Join the discussion

Download v2.2.0
Usage Activity

No Sketchpacks Relay integration found

  • 13 downloads all–time
  • 0 downloads this week
  • 0 downloads this month
About this plugin

iarthstar published this plugin a year ago.

v2.2.0 is the latest of 2 releases

Native updates are supported within