802a9eecf8
* MFM、Misskeyのライブラリを追加 * 描画を追加 * リンク先を修正 --------- Co-authored-by: sorairo <sorairo@shiosyakeyakini.info>
9.7 KiB
| description |
|---|
| MFMは、Misskeyの様々な場所で使用できる専用のマークアップ言語です。 |
MFM
MFMは、Markup language For Misskeyの略で、Misskeyの様々な場所で使用できる専用のマークアップ言語です。
:::tip
一部の構文はMarkdownやHTMLと互換性があります。
:::
MFMが使用可能な場所の例
- ノート本文
- CW注釈
- ユーザーの名前
- ユーザーの自己紹介
構文
メンション
アットマーク + ユーザー名で、特定のユーザーを示すことができます。 :::tip
メンションについての詳細はこちらを参照してください。
:::
@ai
@repo@p1.a9z.dev
ハッシュタグ
ナンバーサイン + タグで、ハッシュタグを示すことができます。 :::tip
ハッシュタグについての詳細はこちらを参照してください。
:::
#misskey
URL
URLを示すことができます。
https://example.com
リンク
文章の特定の範囲を、URLに紐づけることができます。
[example link](https://example.com)
:::tip
リンクテキストの前に?をつけると、リンクプレビューを非表示にすることができます。
?[example link](https://example.com)
:::
カスタム絵文字
コロンでカスタム絵文字名を囲むと、カスタム絵文字を表示させることができます。
:::tip
カスタム絵文字についての詳細はこちらを参照してください。
:::
:misskey:
太字
文字を太く表示して強調することができます。
**太字**
目立たなくする
内容を小さく・薄く表示させることができます。
<small>MisskeyでFediverseの世界が広がります</small>
引用
内容が引用であることを示すことができます。
> MisskeyでFediverseの世界が広がります
中央寄せ
内容を中央寄せで表示させることができます。
<center>MisskeyでFediverseの世界が広がります</center>
よみがな（ルビ）
内容によみがなを付けることができます。
$[ruby Misskey ミスキー]
コード(インライン)
プログラムなどのコードをインラインでシンタックスハイライトします。
`<: "Hello, world!"`
コード(ブロック)
複数行のプログラムなどのコードをブロックでシンタックスハイライトします。
~ (#i, 100) {
<: ? ((i % 15) = 0) "FizzBuzz"
.? ((i % 3) = 0) "Fizz"
.? ((i % 5) = 0) "Buzz"
. i
}
反転
内容を上下または左右に反転させます。
$[flip MisskeyでFediverseの世界が広がります]
$[flip.v MisskeyでFediverseの世界が広がります]
$[flip.h,v MisskeyでFediverseの世界が広がります]
フォント
内容のフォントを指定することができます。
$[font.serif MisskeyでFediverseの世界が広がります]
$[font.monospace MisskeyでFediverseの世界が広がります]
$[font.cursive MisskeyでFediverseの世界が広がります]
$[font.fantasy MisskeyでFediverseの世界が広がります]
ぼかし
内容をぼかすことができます。ポインターを上に乗せるとはっきり見えるようになります。
$[blur MisskeyでFediverseの世界が広がります]
検索
検索ボックスを表示できます。
misskey 検索
文字色・背景色
文字色と背景色を変更することができます。
3,4,6桁のカラーコードで色を表現します。
$[fg.color=f00 赤字]
$[bg.color=ff0 黄背景]
枠線
内容を枠線で囲むことができます。様々なスタイルを指定することができます。
$[border.style=solid,width=4 Default]
$[border.style=hidden No border]
$[border.style=dotted,width=2 Dotted]
$[border.style=dashed,width=2 Dashed]
$[border.style=double,width=4 Double]
$[border.style=groove,width=4 Embossed A]
$[border.style=ridge,width=4 Embossed B]
$[border.style=inset,width=4 Inset A]
$[border.style=outset,width=4 Inset B]
$[border.color=d00 Border color]
$[border.width=5 Border width]
$[border.radius=6,width=2 Border radius]
$[border.radius=5,width=2,color=888 $[position.x=1.5 ＣＳＳ]
$[position.x=1.5 完全に理解した]]
$[border.radius=5,width=2,color=888,noclip $[position.x=1.5 ＣＳＳ]
$[position.x=1.5 完全に理解した]]
角度変更
指定した角度で回転させます。
$[rotate.deg=30 misskey]
位置変更
位置をずらすことができます。
😏$[position.x=0.8,y=0.5 🍮]😀
拡大
文字を引き延ばして表示します。
$[scale.x=4,y=2 🍮]
$[x2 x2]
$[x3 x3]
$[x4 x4]
アニメーション(びよんびよん)
$[jelly 🍮] $[jelly.speed=5s 🍮]
アニメーション(じゃーん)
$[tada 🍮] $[tada.speed=5s 🍮]
アニメーション(ジャンプ)
$[jump 🍮] $[jump.speed=5s 🍮]
アニメーション(バウンド)
$[bounce 🍮] $[bounce.speed=5s 🍮]
アニメーション(回転)
$[spin 🍮] $[spin.left 🍮] $[spin.alternate 🍮]
$[spin.x 🍮] $[spin.x,left 🍮] $[spin.x,alternate 🍮]
$[spin.y 🍮] $[spin.y,left 🍮] $[spin.y,alternate 🍮]
$[spin.speed=5s 🍮]
アニメーション(ぶるぶる)
$[shake 🍮] $[shake.speed=5s 🍮]
アニメーション(ブレ)
$[twitch 🍮] $[twitch.speed=5s 🍮]
レインボー
$[rainbow 🍮] $[rainbow.speed=5s 🍮]
$[rainbow 色なし文字]
$[rainbow $[fg.color=f0f 色付き文字]]
キラキラ
$[sparkle 🍮]
プレーン
内側の構文を全て無効にします。
<plain>**bold** @mention #hashtag `code` $[x2 🍮]</plain>
開発者向け情報
MFMのパーサーや描画の実装はライブラリとして公開されており、簡単にクライアントにMFMを組み込むことが可能です。
- misskey-dev/mfm.js - JavaScriptパーサー実装
- mfm-renderer - Vue.js用コンポーネント
- mfm.kt - Kotlinパーサー実装
- mfm_parser - Dartパーサー実装
- mfm - Flutter用描画ウィジェット