> ## Documentation Index
> Fetch the complete documentation index at: https://lemonslice.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# LemonSlice Lite

> Low-cost avatars for high-volume consumer apps

export const LiteDemoCard = ({label, scenario, children}) => {
  const cardRef = useRef(null);
  const [hovered, setHovered] = useState(false);
  const [playing, setPlaying] = useState(false);
  const toggle = () => {
    const v = cardRef.current?.querySelector("video");
    if (!v) return;
    if (v.paused) {
      v.play();
      setPlaying(true);
    } else {
      v.pause();
      setPlaying(v.currentTime > 0.1);
    }
  };
  return <div ref={cardRef} className="lite-demo-card not-prose" data-playing={playing ? "true" : "false"} role="button" tabIndex={0} aria-label={`Play demo: ${label}`} onClick={toggle} onKeyDown={e => {
    if (e.key === "Enter" || e.key === " ") {
      e.preventDefault();
      toggle();
    }
  }} onMouseEnter={() => setHovered(true)} onMouseLeave={() => setHovered(false)} style={{
    position: "relative",
    overflow: "hidden",
    borderRadius: "1.15rem",
    cursor: "pointer",
    aspectRatio: "2 / 3",
    background: "#111"
  }}>
      {children}
      <div style={{
    position: "absolute",
    top: "0.65rem",
    left: 0,
    right: 0,
    zIndex: 2,
    display: "flex",
    justifyContent: "center",
    padding: "0 0.55rem",
    pointerEvents: "none"
  }}>
        <div className="lite-demo-badge" style={{
    display: "inline-flex",
    alignItems: "center",
    gap: "0.35rem",
    maxWidth: "100%",
    padding: "0.32rem 0.75rem",
    borderRadius: "9999px",
    background: "rgba(0, 0, 0, 0.55)",
    color: "#fff",
    fontSize: "0.72rem",
    fontWeight: 600,
    letterSpacing: "0.01em",
    lineHeight: 1.3,
    backdropFilter: "blur(4px)",
    WebkitBackdropFilter: "blur(4px)",
    textAlign: "center",
    whiteSpace: "normal",
    overflowWrap: "normal",
    wordBreak: "normal"
  }}>
          <svg className="lite-demo-badge-icon" viewBox="0 0 12 12" aria-hidden="true" style={{
    width: "0.7rem",
    height: "0.7rem",
    flexShrink: 0
  }}>
            <path d="M3 2.5v7l7-3.5L3 2.5z" fill="currentColor" />
          </svg>
          <span>{label}</span>
        </div>
      </div>
      <div className="lite-demo-hover" style={{
    position: "absolute",
    left: 0,
    right: 0,
    bottom: 0,
    zIndex: 2,
    padding: "2.5rem 0.85rem 0.85rem",
    background: "linear-gradient(to top, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.55) 55%, transparent 100%)",
    opacity: hovered ? 1 : 0,
    transition: "opacity 0.18s ease",
    pointerEvents: "none"
  }}>
        <div className="lite-demo-kicker" style={{
    color: "rgba(255, 255, 255, 0.72)",
    fontSize: "0.62rem",
    fontWeight: 600,
    letterSpacing: "0.08em",
    textTransform: "uppercase",
    marginBottom: "0.25rem"
  }}>
          SCENARIO
        </div>
        <div className="lite-demo-scenario" style={{
    color: "#fff",
    fontSize: "0.82rem",
    fontWeight: 500,
    lineHeight: 1.35
  }}>
          {scenario}
        </div>
      </div>
    </div>;
};

## Overview

LemonSlice Lite is specifically designed for the unique needs of consumer interactive avatar apps:

* Low cost
* High volume
* Ultra-low latency
* Instant character creation

Lite runs at a lower resolution than the standard LemonSlice model (368 x 240). In exchange, it offers a significantly lower price per minute, making it a strong fit for high-volume consumer products where at-scale costs matter most.

<Info>
  Lite is an enterprise-only feature. Contact [support@lemonslice.com](mailto:support@lemonslice.com) to get access.
</Info>

## Examples

The Lite model excels at rendering avatars of any style - photorealistic, 3D pixar-style cartoons, and 2D cartoons like manga.

<div className="lite-demo-grid not-prose">
  <LiteDemoCard label="Customer Service" scenario="Can you help me plan a vacation to France?">
    <img className="lite-demo-poster" src="https://mintcdn.com/lemonslice/EGh-enbehas60X64/images/lite/woman.webp?fit=max&auto=format&n=EGh-enbehas60X64&q=85&s=610be6b847f35c85eec20194a41f78de" alt="" width="388" height="584" data-path="images/lite/woman.webp" />

    <video className="lite-demo-clip" src="https://mintcdn.com/lemonslice/WwjMuRnwdkTJM_2i/videos/lite/woman.webm?fit=max&auto=format&n=WwjMuRnwdkTJM_2i&q=85&s=991eedc50f5e99215f344cf79608a757" playsInline preload="metadata" data-path="videos/lite/woman.webm" />
  </LiteDemoCard>

  <LiteDemoCard label="Education" scenario="Can you explain why the sky is blue?">
    <img className="lite-demo-poster" src="https://mintcdn.com/lemonslice/EGh-enbehas60X64/images/lite/man.webp?fit=max&auto=format&n=EGh-enbehas60X64&q=85&s=9969032a857d57ac35ff1b3b69ed850b" alt="" width="388" height="584" data-path="images/lite/man.webp" />

    <video className="lite-demo-clip" src="https://mintcdn.com/lemonslice/WwjMuRnwdkTJM_2i/videos/lite/man.webm?fit=max&auto=format&n=WwjMuRnwdkTJM_2i&q=85&s=2d6f0b0e7ebd361b7d365f92ea3a87c0" playsInline preload="metadata" data-path="videos/lite/man.webm" />
  </LiteDemoCard>

  <LiteDemoCard label="Kids App" scenario="What's your favorite flower, and why?">
    <img className="lite-demo-poster" src="https://mintcdn.com/lemonslice/EGh-enbehas60X64/images/lite/girl.webp?fit=max&auto=format&n=EGh-enbehas60X64&q=85&s=a6ff6569a2c3d7b2c14e8b839c1fbb0f" alt="" width="388" height="584" data-path="images/lite/girl.webp" />

    <video className="lite-demo-clip" src="https://mintcdn.com/lemonslice/WwjMuRnwdkTJM_2i/videos/lite/girl.webm?fit=max&auto=format&n=WwjMuRnwdkTJM_2i&q=85&s=8a0f2bd6f6a0fc9123da463431c54bb1" playsInline preload="metadata" data-path="videos/lite/girl.webm" />
  </LiteDemoCard>

  <LiteDemoCard label="Interactive Entertainment" scenario="What's your favorite Japanese snack food?">
    <img className="lite-demo-poster" src="https://mintcdn.com/lemonslice/EGh-enbehas60X64/images/lite/anime.webp?fit=max&auto=format&n=EGh-enbehas60X64&q=85&s=cd696a8e57381bdb82f43e9adcc539fd" alt="" width="388" height="584" data-path="images/lite/anime.webp" />

    <video className="lite-demo-clip" src="https://mintcdn.com/lemonslice/WwjMuRnwdkTJM_2i/videos/lite/anime.webm?fit=max&auto=format&n=WwjMuRnwdkTJM_2i&q=85&s=6c8b78bbca2e4975d674d18390060504" playsInline preload="metadata" data-path="videos/lite/anime.webm" />
  </LiteDemoCard>
</div>

## Usage

Set the optional `model` parameter to `"lite"` when starting a session. Supported `aspect_ratio` values are `"2x3"` and `"1x1"`.

<CodeGroup>
  ```python LiveKit (Python) theme={null}
  avatar = lemonslice.AvatarSession(
      agent_image_url="...",
      model="lite",
      aspect_ratio="2x3",
  )
  ```

  ```javascript LiveKit (Node.js) theme={null}
  const avatar = new lemonslice.AvatarSession({
    agentImageUrl: "...",
    extraPayload: { model: "lite", aspectRatio: "2x3" },
  });
  ```

  ```python Pipecat (Python) theme={null}
  transport = LemonSliceTransport(
      ...
      session_request=LemonSliceNewSessionRequest(
          agent_image_url="...",
          model="lite",
          aspect_ratio="2x3",
      ),
  )
  ```
</CodeGroup>

## Framing and image tips

For best results when using Lite:

* Use close-up portraits of the face and upper shoulders for photorealistic inputs
* Minimize deadspace above the character's head
* Try using an image that zooms in more on the character if artifacts are present

See [Avatar Image Tips](/prompting-guide/avatar-image-tips) for general guidance on reference images.
