Text in · SVG out

Diagrams from plain text.

SheepText turns a small, readable language into deterministic SVG diagrams — in your browser, your docs, and CI. No dragging boxes, no drifting layouts.

Open the editor → Read the tutorial 
use icons aws
layout row Spine: Users Client Cloud

Users:  icon aws:users "Users"
Client: icon aws:client "Chat client"

Cloud: [
  Gateway: icon aws:amazon-api-gateway "API Gateway"
  Fn:      icon aws:aws-lambda "Chatbot"
  Vision:  icon aws:amazon-rekognition "Rekognition"
] "AWS Cloud"

from Users   arrow "1. post image" to Client
from Client  arrow "2. API call"   to Gateway
from Gateway arrow "3. invoke"     to Fn
from Fn      arrow "4. moderate"   to Vision
from Fn      arrow "5. push via chat API" to Client route above
A rendered SheepText diagram of an image-moderation chatbot: users post an image to a chat client, which calls an API Gateway inside an AWS Cloud group; a Lambda chatbot moderates the image with Rekognition and pushes the verdict back to the chat client, each arrow numbered in flow order and drawn with AWS icons

One language, every shape of diagram

Icons from ten packs, styled fills and nested groups, flowcharts and routed connectors — a constraint solver lays it all out for you. 

// The load balancer only talks to the app server; the app server owns both stores.
// Ideal rendering: tiers side by side, LB above App, and App's two outbound
// edges reaching the data tier as separate, non-crossing runs.

layout column Web: LB App
layout column Data: PG Cache

Web: [
  LB:  box "Load Balancer" fill #dbeafe stroke #2563eb
  App: box "App Server" fill #dbeafe stroke #2563eb
] "Web Tier" fill #2563eb bold

Data: [
  PG:    box "Postgres" fill #dcfce7 stroke #16a34a
  Cache: box "Redis" fill #fef9c3 stroke #ca8a04
] "Data Tier" fill #16a34a bold

arrow from LB to App
from App arrow "SQL" to PG
from App arrow "cache" to Cache
A two-tier architecture diagram: a Web Tier group where a load balancer feeds an app server, and a Data Tier group with Postgres and Redis; the app server reaches Postgres over a labelled SQL edge and Redis over a labelled cache edge
Style fills and strokes, nest related nodes into labelled groups. 
// Two gates that fail differently: 401 means "we don't know who you are",
// 403 means "we know, and no". Collapsing them into one check is the usual
// bug in a hand-drawn auth flow.
//
// Ideal: a downward spine Request -> Authenticated? -> Authorized? -> 200 OK,
// each "no" peeling off to its own reject box. No layout directives here on
// purpose -- the arrows already say the shape.

Start: box "Request"
Authn: box "Authenticated?" fill #fef08a
Authz: box "Authorized?" fill #fef08a

Out: [
  Unauth: box "401 Unauthorized" fill #fee2e2
  Forbid: box "403 Forbidden" fill #fee2e2
  Ok:     box "200 OK" fill #dcfce7
] "Outcomes"

arrow from Start to Authn
from Authn arrow "no"  to Unauth
from Authn arrow "yes" to Authz
from Authz arrow "no"  to Forbid
from Authz arrow "yes" to Ok
A flowchart: a Request reaches an Authenticated? decision; no returns 401 Unauthorized, yes continues to an Authorized? decision; no returns 403 Forbidden, yes returns 200 OK
Flowcharts and decisions, with connectors routed automatically.