Kurze, praktische Tipps rund um Framer, Webdesign und den produktiven Einsatz der Plattform.
Du willst in Framer eine spezielle Schriftart nutzen oder aus DSGVO-Gründen auf Google-Fonts verzichten?
Kein Problem. Wechsle vom Projekt auf die Startseite bzw. das Dashboard und wähle im Dropdown oben links “Settings”. Wechsle im Tab “Workspace” zu “Fonts”. Hier kannst du bequem deine Schrift-Dateien hochladen (WOFF2 oder TTF) und in allen Projekten des Workspaces nutzen.
In Framer sind im Free-Plan einmalig 500 Credits, im Basic-Plan 1000 Credits und im Pro-Plan 3000 Credits standardmäßig enthalten.
Sollten diese nicht ausreichen, kann man in Framer jederzeit in den Einstellungen unter “Usage” im Tab “Credits” zusätzliche KI-Credits zubuchen. Diese werden ebenfalls monatsweise hinzugefügt und entweder monatlich oder jährlich abgebucht.
Die Preise für zusätzliche Credits aktuell:
je 1000 Credits im Monat: 17,85€ brutto bei monatlicher Abrechnung bzw. 137,75€ brutto bei jährlicher Abrechnung.
Buchbar sind monatliche Pakete zwischen 1000 und ganzen 400.000 Credits, dabei gibt es keinen Mengenrabatt.
Praktisch: In der Framer-App auf MacOS und Windows lassen sich jegliche Elemente auf dem Canvas als JPG, PNG oder Vektorgrafik exportieren.
Dafür muss man nur das Element auswählen und im Property-Panel zu “Export” runterscrollen. Optional lassen sich mehrere Exportformate und Auflösungsstufen direkt anlegen.
AEO steht für Answer Engine Optimization und wird in den kommenden Jahren wahrscheinlich wichtiger als SEO heute: Können ChatGPT, Claude, Gemini & co. deine Webseite finden und zitieren?
Mit dem neuen Tool von Framer kann man auf framer.link/aiᶠ ohne Anmeldung checken, wie gut Webseiten scoren.
Ein interessanter aufkommender Standard sind neben klassischen robots.txt die neuen llms.txt, die KI-Systemen eine maschinenlesbare Übersicht einer Website liefern.
Mit dem Plugin “Design Bridge MCP” lässt sich Framer sehr einfach und kostenlos mit Claude verbinden. Nach dem Öffnen des Plugins erhältst einen sog. MCP-Link, den du kopieren musst.
In Claude, wechsle in den Einstellungen zu den Konnektoren, klicke auf das Plus-Symbol und wähle “Benutzerdefinierten Connector hinzufügen”. Trage bei “Name” am besten “Framer” ein, und füge bei “Remote MCP Server URL” den MCP-Link ein. Die erweiterten Einstellungen musst du nicht beachten.
Wähle anschließend aus, welche Rechte Claude über dein Framer-Projekt hat. Claude kann jetzt:
Das Canvas sehen und bearbeiten
CMS-Kollektionen sehen, bearbeiten und neue Items erstellen
Styles bearbeiten & erstellen
Seiten bearbeiten & erstellen
Komponenten sehen & bearbeiten
Während Claude arbeitet, muss das Framer-Projek permanent in deinem Browser geöffnet und das Plugin aktiv sein.
Besonders praktisch ist das MCP zum Analysieren des Projekts oder Durchsuchen nach Schreibfehlern uvm.
Vorsicht: Claude bekommt je nach Rechtevergabe über MCP echten Lese- & Schreibzugriff auf das ganze Projekt und hat keinen “Rückgängig”-Button.
Update 16. Juni: Soeben hat Framer mit External Agents einen offiziellen MCP eingeführt. Alle Infos
Um einen Framer-Account anzulegen, klicke auf diesen Link: framer.link/accountᶠ und trage deine Mailadresse ein. Framer schickt dir dann eine Mail mit einem Login-Link. Öffne diesen im gleichen Browser, in dem du deine Mail eingetragen hast und der Account ist erstellt.
Für deinen Framer-Account benötigst du kein Passwort, da Framer über einmalige Login-Links, auch Magic-Links funktioniert.
Bei der erstmaligen Anmeldung wirst du durch ein paar Fragen geführt, anschließend landest du auf deinem Dashboard, wo du Projekte erstellen kannst.
FramerVerstehen.de auf Discord!
Jetzt Discord-Community beitreten
Jetzt zum Newsletter anmelden
Fragen zum Thema
Kann ich Framer mit Claude verbinden?
Ja, mithilfe der External Agents. Claude liest und verändert dein Projekt wie der interne Agent, verbraucht dabei aber dein Claude-Kontingent statt Framer-Credits.
Brauche ich ein Passwort für Framer?
Nein. Framer arbeitet mit Magic Links: Bei jeder Anmeldung bekommst du eine Mail mit einem einmaligen Link, den du im selben Browser öffnest.
Gibt es Framer als Desktop-App?
Ja, für macOS und Windows. Einzelne Funktionen gibt es tatsächlich nur in der App, etwa der Export von Canvas-Elementen als JPG, PNG oder Vektorgrafik.
Kann ich in Framer eigene Schriftarten hochladen?
Ja. Im Dashboard oben links auf „Settings“, dann im Tab „Workspace“ zu „Fonts“. Dort kannst du WOFF2- oder TTF-Dateien hochladen, sie stehen danach in allen Projekten des Workspaces bereit. Besonders wichtig, wenn du aus Datenschutzgründen auf Google Fonts verzichten willst.
Kann ich Grafiken aus Framer exportieren?
Ja, in der Desktop-App für macOS und Windows. Wähle das gewünschte Element aus und scrolle im Property-Panel zu „Export“. Möglich sind JPG, PNG und Vektorgrafiken, auf Wunsch auch mehrere Formate und Auflösungen gleichzeitig.
Was ist AEO und kann Framer das?
AEO steht für Answer Engine Optimization und beantwortet, ob ChatGPT, Claude oder Gemini deine Seite finden und zitieren. Framer bietet dafür einen kostenlosen Scanner ohne Anmeldung.
Sehen ChatGPT und Claude meine Framer-Website?
Das kannst du in einer Minute mit Framers kostenlosem Scanner prüfen, ohne Anmeldung. Neben der klassischen robots.txt setzt sich gerade die llms.txt durch, die KI-Systemen eine maschinenlesbare Übersicht deiner Seite liefert.