Lightwell and the LightwellKit

Welcome to Lightwell!

The API is currently in beta and everything inside of these docs will be changing to improve the SDK. If there is a change you’d like to see or have any feedback, please email us at

This framework provides programmatic access to designs created in the Lightwell editor. To try it out visit and download the editor. After setting up a project in Lightwell, click on the top right of the window to get:

  • Sliced images and screen data organized into an asset catalog called *Assets.xcassets*
  • Audio media files in a folder called *Assets*
  • The *LightwellKit* framework

Make sure to include these files in your Xcode project. The screen documents can be loaded through a LWKLoadingContext. By default this loading context will initialize UIViews and CAAnimations. However, LWKLoadingContext also provides an option to read the raw styling data as LWKLayerInfo and LWKAnimationInfo if you’d like to customize the translation to native elements.

To initialized all of the elements you can use something like the following:

import LightwellKit
// Initialize the context
let loadingContext = LWKLoadingContext(screenName: "my awesome screen")
// Lazy load the views and attach to the hierarchy
loadingContext?.views.forEach { self.view.addSubview($0) }
// Retrieve view
if let view = self.loadingContext?.view(for: "my view") {
    // Retrieve animation
    if let animation = self.loadingContext?.animation(for: "my animation") {
        // Play animation
        view.layer.add(animation, forKey: nil)

The default implementation will always try to create the simplest UIKit element to represent the content if possible. Since UIKit doesn’t have a UIView that natively supports custom path shapes, path based content will be rendered as an LWKShapeView backed by CAShapeLayer.

If you have any questions please get in touch with us via email or chat with us on!