2024-04

GmailのUIデザインをコンポーネント・パターン・フローごとにまとめています。webデザイン、アプリデザインの参考に活用ください。

仕事効率化

Gmail

オンボーディング

e1424185-3d34-405f-9034-aa675f403be5.webp

46a69054-a11b-451f-8b46-90bc6562810b.webp

cd2ebbdb-d227-4276-a37e-5365118892c4.webp

ea506728-7958-4f5c-bd2a-ed5bfd5362e1.webp

6b767915-e51f-4822-9c7f-4bf82e60d93f.webp

受信トレイ

c3a1eb37-2555-4d54-bb2e-c7cdb4bf7a71.PNG

eb3d373d-35e9-402f-8a37-e4ff8e0be178.PNG

3ce04511-7032-458e-9935-583ea183cde6.webp

2ded6632-47f1-41ec-badc-8197e030655b.webp

f1936113-9e1a-4702-94ca-af27d8423b36.webp

2737c047-5af1-42a2-9c44-2cdceb82da90.webp

535f614c-f07e-425d-bad5-9e0cc4237e56.webp

8085a1c1-af2c-482f-8508-cc00365b93e5.webp

180ed04f-e4f7-461d-aef3-75cb8595a79f.webp

13738b02-8271-473f-a11e-c309a9dd2c66.webp

f5e99aaa-f3a3-46e4-8bc7-54b4cf37a279.webp

f63001f9-e379-4a33-b91d-428201fe629c.webp

9ffbaed5-3e53-46c0-aa55-cba4f90f4aa7.webp

5dd19407-a901-4b10-922f-5fa898c8eaf7.webp

dbb24357-706c-4afd-b89f-288bec257cbd.webp

47918707-9fa3-45c4-aee2-5b78a8d99be3.webp

100673ad-9295-444f-a546-9a92681fc54f.webp

メール詳細

450d128b-2e53-4836-bad4-f50cd65e10f1.webp

98e0d66f-e320-4346-b951-5b81a079cd72.webp

4c5f23d4-d72e-4bbd-bb2b-1223f294d747.webp

abf347f9-ff04-41b2-b798-ba47b794b4ff.webp

63544f1e-5b9b-41f4-a068-495c9fbeb4e8.webp

1b6a66af-1784-44e3-88cc-10de6e685018.webp

e952e1e7-2ba7-44db-81a4-9e3843b667aa.webp

1ef32f10-7b08-4cda-82ad-3973483d1ccb.webp

fb9029bc-9770-4249-8c6d-e2b26c152da4.webp

6e9ee97a-39af-4c1e-9eba-977d19186801.PNG

検索

4bc419a5-9469-4902-bd43-b5948371ece1.webp

e80b4604-e3cf-4c65-9c5a-3ab2df3cbe95.webp

ea6e5b09-680c-492a-892f-5ec28358624b.webp

20c6db22-a4a8-41fb-85a6-99ff18c9a6d7.webp

773f6850-ec42-4181-aed9-2814c35a0b2b.webp

1c0a1f74-1a9e-4f0b-930f-2090ebe99d47.webp

7c061d32-7be8-489d-8a78-0153ce9a7f71.webp

4b014278-9873-43b2-a3cf-26b59f4be066.webp

da6d1141-a33d-45aa-8128-1eea5e2e3bd6.webp

abf9cda6-1b3a-4235-b994-6fc64bb9d05b.webp

ba9e24dc-8000-42d0-8373-1e7eb5d69eb5.webp

0c43bee9-1cec-442a-a2da-29e5cefae436.webp

dedf557d-43c9-42cc-882d-a172ee247419.webp

8d43b4fc-b7d3-49bd-8818-668e6aab1d9b.webp

5cb28121-a7cc-4cec-8c2c-326f8fba6080.webp

作成

adda879c-ad35-4850-9fcf-5cccc589e66d.webp

5f6ff84a-6383-4637-8dcd-d96223d419ff.webp

7463d291-d15b-46c1-82f3-aa77d91b7cf0.webp

caf6f810-d73e-4639-8d8e-b7913d75f960.webp

9dc60a48-e487-4019-a6b9-a36b0a513488.webp

56112322-308b-4a42-8568-d9547d51aea1.webp

8ce28fe6-7935-48dd-91a9-316d359770d2.webp

79d2261b-d93c-408a-a2b8-c2b7f1b8a7c6.webp

919a483c-f936-48d9-a189-a1acdc588a36.webp

9545ac56-ce9f-4524-9641-b56b16ae21a5.webp

9edf4a58-2fc6-4945-b5eb-570de541d699.webp

572d866b-adb3-451e-906a-3565ee6bf9d0.webp

09d129dc-9aee-4ce9-82d9-9cb8c308f788.webp

11d25538-4095-40f2-a384-37024bfd6df0.webp

450ffad9-d499-4015-8666-9208cfdcdbec.webp

70f9f531-1152-4249-a152-b480e8b04ec3.webp

15045654-bda7-436a-9a04-97f6e771e644.webp

55626e0a-aa2b-4567-a733-7ec96724b929.webp

b36f29c6-b901-4497-b22b-09e9956fed87.webp

b5d469ed-c14a-41be-8255-3cb85c58f9b6.webp

867935dd-d66d-47f2-8588-52da8847b0ea.webp

381790e8-988d-40eb-ac9c-54caf6d1dee2.webp

b64e7b2c-ca5f-4711-9f9c-6379b46f4f3c.webp

6a379a05-013c-4d3f-b978-44b5e9127958.webp

f70bc33a-955f-4597-9c1c-cedbee605201.webp

01a29f88-24c9-46ed-91a5-676d74d4d031.webp

9bed29b7-a91f-4b9c-98e5-7747f33db8f8.webp

469c7124-75f8-4211-a9a9-dc8e2e182e70.webp

34f10c18-db21-426f-94c1-2155b2e4e370.webp

151f9ab4-fbe0-4e73-9652-d449604dcb62.webp

返信

b0e269bd-bdd3-45d2-a72e-17c1a21efa53.webp

a9527d1e-5931-4a92-9973-b6d7397808ab.webp

fae0f1a6-2503-4122-a0f2-57486fdb93e3.webp

277f5d08-c347-4c3b-85d1-f426ac0ac05b.webp

0b5f4b25-8d19-41d2-a2c8-c8c9e11d3aab.webp

Meet

2c760089-e9fc-447d-96fb-8fa6f375e68a.webp

4ff2947c-08fd-4e3e-8f03-71cf22e77b2b.webp

cd57a158-2cb2-4e25-b105-a5498227cdd9.webp

10178780-9965-4c1b-b120-1e8eaf3b7610.webp

20aa860e-4b8b-4c5b-8220-5494ef2cf502.webp

d23f6e3a-1a7b-4885-9af9-cb7f1c4f6abb.webp

572b3fd0-3d63-487a-b093-4ed258558452.webp

b6611803-4e9f-4c6d-a777-e6e2e9abebd6.webp

9d2f9e5f-6974-4644-a3ca-61e0d4684ba5.webp

Meet詳細

3eb0275b-3534-49a7-aca0-2bc8cfd7c69b.webp

a894b30f-e819-43cc-9856-9ee01bf5014d.webp

605f8d9d-75f4-4149-a9a8-ae2bb04fb56f.webp

437b2a6b-71db-4984-8f39-952be4805515.webp

378d3c45-407d-4619-9638-5d657c022ab6.webp

9cd4b081-23a2-44c8-88ec-503f4e9d7bfe.webp

82406f01-0570-4281-9b79-e84a63d1ea3d.webp

ebd7ee9d-57b4-443e-adde-11057a599227.webp

3f3ef85e-343b-4eeb-a629-0a5a6ab0fa8a.webp

4b39242d-ced7-443a-8a55-9c7574ed2eab.webp

8092f23c-f7e3-4f87-ac0b-1a35d33271c0.webp

0f0dc6f8-fd68-4fce-bcff-b68777626b85.webp

dae08483-6be4-40ff-b7b8-7feb06d4cca4.webp

376c52a7-548b-4662-8288-f2cae70955ea.webp

a37a45a0-1f3c-44a9-9a6b-38e1457c7c8a.webp

4aa141c1-2076-4a8f-ba5c-0bef471cf489.webp

2f69e009-6e7e-48e0-b03c-ac9957a43d2b.webp

9da37746-6f80-4eab-940e-d9dc13a3cacf.webp

b318c769-10cf-4275-9d2d-e570d9be2272.webp

15954d7e-647f-49cb-bdbb-6776908c7772.webp

c05eeec1-0c38-4417-a78e-ba2d47a0e46e.webp

99b6d573-adb6-4922-9fa4-88613bbb3104.webp

c1a26904-6245-4ee4-9a8b-a0846df5f446.webp

94814aae-d800-4eef-b519-5847abf49fe7.webp

f6012b0a-3cb3-46e8-9642-58b7127ba62c.webp

743f4371-1837-4722-9628-3fab9b3cb3e0.webp

4f562ea0-fe08-4c4b-af8c-5637ef774606.png

42c13780-c18a-4ce0-9c9c-b838c04037a8.png

エフェクト

f9860bf4-bdcb-4f37-a5ed-752c760f31f8.webp

0f9ef858-5349-4313-a1b3-c48a30590dae.webp

010ce40a-4ec2-4553-83b1-f6658043e84d.webp

fb4eea6f-7896-4237-9b67-69c2f0b8a822.webp

d1d59747-2ffc-4968-8605-b5f121ed6bd2.webp

b4c3fa81-8a04-4da4-9e9c-1150ca50c6d6.webp

83f2c32b-459e-449d-b2da-f7a854530410.webp

31d95dec-7a01-49b0-86f0-05b8c357c462.webp

76d8acd2-4a09-476d-b76b-d752912a35ba.webp

オプション

b6ac6e99-31d8-4f8d-b52f-96f7dc04b5d8.webp

dcb30532-1211-4b15-889f-824610ad6011.webp

57c5e054-c8fe-4781-be72-9c70471f8573.webp

e5fd75c6-212b-4103-bdb4-686f8262c505.webp

38b0e7d0-0644-4ce4-b947-e49922fb7b15.webp

0a068b24-680e-44d3-8295-32f4a20245e0.webp

3ccaadff-8a08-43cf-8fc6-e5c0294617ec.webp

f66efcbb-9dc3-47db-b13e-b7a20fd552db.webp

5fd07990-8ada-47b1-90c2-31f5f231193e.webp

9135912e-09ec-42b5-ac0b-da98709f6ffd.webp

e2fbdd77-01ce-4097-82bc-e5ece66229f9.webp

021d3b64-a556-438a-b256-37070c3ba060.webp

402e1a2e-b28c-438c-a491-dd85e0c69c78.webp

05eb2db8-3fc0-431e-8bd4-830365256a2f.webp

340ad82f-1b0f-4914-a79a-716b11ae5a49.webp

f40741b2-92b1-4f10-be67-589d6b5afd54.webp

6eafda42-10f6-4742-ac8a-5f48fbc96a4e.webp

0a5e67d0-a3cc-4960-838a-fefef0485950.webp

8094d415-5978-41e1-a421-849f225a6231.webp

5e611220-4f96-433c-b6c9-49b55c4237fd.webp

b88c0638-f6ed-46d2-ac7e-46edb3bc791b.webp

7f598591-5891-4890-94a2-310870181ce2.webp

6ae66a3a-551d-49b6-a338-e2a644344552.webp

a0ee2f5f-cf40-40e8-9bd7-4e878dd7ab44.webp

a3f095a0-d03e-468f-85ba-7e7bd6083178.webp

5968585a-84d6-4f5b-b1fb-10514062a966.webp

5ccd4ef2-24c8-4965-994c-687b002a0d3c.webp

de53a5e2-62fe-4cb1-b04f-6654f4c3637f.webp

54752867-4525-474a-b53b-abe64009100c.webp

ad15ca77-c509-40a5-9220-de9540b3b08e.webp

be9fbd41-800a-41ff-99b1-727de2672840.webp

5a3940c0-4203-4628-893e-9035fcdaf10f.webp

0f287c7e-cd84-484d-a668-6c99039f7ad9.png

5e78ea04-ac63-40b4-9f28-90c9303c75f5.png

メニュー

489252a5-a8a9-4f1a-a45d-c8a0e0b704d1.webp

b20a55e9-d251-401c-941d-9048aa49de5c.webp

6d021fb5-e570-4412-ad9f-aa6416222942.webp

d60c7d7b-f347-4939-a3c4-aac178347d9b.webp

374f4aa9-951a-4c96-b750-ae0f1cd2aa64.webp

e4631a0c-0fa3-481b-905f-902ec404f0dd.webp

a9237b55-c4dd-4051-864f-9bbb2acc7d19.webp

82940696-b4ca-479d-bc48-3a27d3ada5da.webp

20dc5152-a630-47f6-a325-89cba9123be7.webp

aafb62c5-4559-4461-bd0e-5b94163842bd.webp

6ba27dfa-8216-4561-9e40-1e0cd8f8d496.webp

aa1c4821-ac1a-4e0e-94e7-b385311cf5ca.webp

db952ce4-1c91-4d8f-b019-76e8a6b34d1e.webp

d715812d-a9ed-4784-9b57-f68900913e13.webp

9276a4a2-6ecd-4273-aff5-88952a181c13.webp

設定

1f7b20d2-8669-4696-bc85-8fb03e9036de.webp

3c5622e8-4298-4030-b97f-e8345238c604.webp

311ba2aa-4c8b-401d-a9fa-8283d257679b.webp

ae26ca6d-65e1-4c95-8b4d-0ded429310ce.webp

f088c29b-b9e3-4a28-9c0a-76317dcdb4bb.webp

aa0d4fc8-1389-498d-b133-4feeeb3aa429.webp

22035b30-bcca-4d4a-b53a-30902fdf647d.webp

0b135e01-494c-4970-9b51-d09945a5fbca.webp

「Gmail」のUIデザイン一覧（2024年4月版）

Gmail

オンボーディング

受信トレイ

関連アプリ