LoginSignup
38
32

More than 5 years have passed since last update.

マテリアルデザインのTextAppearanceがどのサイズでどの色かまとめ メモ

Last updated at Posted at 2017-01-25

デザイナーなどから渡していただくプロトタイプなどからだとエンジニアがどのテキストのスタイルを適応すればいいのかよくわからない!!そんなときありませんか?
1つずつスタイルを調べるにしてもテーマは親子関係があるので、たどるのは面倒です。

そんなときのための早見表です。
(プロトタイプでこの位置のこのテキストはBody1とか分かる手段があればいいんですが、、)
(日本語はDense Scriptなので、、とかは一旦置いています)

テーマの色

デフォルトのテーマでの色(テーマエディタより)

Attribute名 色(表示の透明度が効いていないので注意)
textColorPrimary image
textColorSecondary image
textColorTertiary image

TextAppearance一覧

TextAppearance.AppCompat

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_body_1_material=14sp

TextAppearance.AppCompat.Display4

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_4_material=112sp

TextAppearance.AppCompat.Display3

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_3_material=56sp

TextAppearance.AppCompat.Display2

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_2_material=45sp

TextAppearance.AppCompat.Display1

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_1_material=34sp

TextAppearance.AppCompat.Headline

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_headline_material=24sp

TextAppearance.AppCompat.Title

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_title_material=20sp

TextAppearance.AppCompat.Title.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_title_material=20sp

TextAppearance.AppCompat.Subhead

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_subhead_material=16sp

TextAppearance.AppCompat.Subhead.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_subhead_material=16sp

TextAppearance.AppCompat.Body2

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_body_2_material=14sp

TextAppearance.AppCompat.Body1

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_body_1_material=14sp

TextAppearance.AppCompat.Caption

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_caption_material=12sp

TextAppearance.AppCompat.Menu

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

TextAppearance.AppCompat.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_body_1_material=14sp

TextAppearance.AppCompat.Large

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_large_material=22sp

TextAppearance.AppCompat.Large.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_large_material=22sp

TextAppearance.AppCompat.Medium

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_medium_material=18sp

TextAppearance.AppCompat.Medium.Inverse

android:textColor:?android:attr/textColorSecondaryInverse
android:textSize:@dimen/abc_text_size_medium_material=18sp

TextAppearance.AppCompat.Small

android:textColor:?android:attr/textColorTertiary
android:textSize:@dimen/abc_text_size_small_material=14sp

TextAppearance.AppCompat.Small.Inverse

android:textColor:?android:attr/textColorTertiaryInverse
android:textSize:@dimen/abc_text_size_small_material=14sp

TextAppearance.AppCompat.Button

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

TextAppearance.AppCompat.Widget.Button

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

TextAppearance.AppCompat.Widget.Switch

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

TextAppearance.AppCompat.Widget.TextView.SpinnerItem

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

** ここまで推奨 Support Libraryのテーマファイルより **


Base.TextAppearance.AppCompat.Title.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_title_material=20sp

Base.TextAppearance.AppCompat.Subhead.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_subhead_material=16sp

Base.TextAppearance.AppCompat.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_body_1_material=14sp

Base.TextAppearance.AppCompat.Large.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_large_material=22sp

Base.TextAppearance.AppCompat.Medium.Inverse

android:textColor:?android:attr/textColorSecondaryInverse
android:textSize:@dimen/abc_text_size_medium_material=18sp

Base.TextAppearance.AppCompat.Small.Inverse

android:textColor:?android:attr/textColorTertiaryInverse
android:textSize:@dimen/abc_text_size_small_material=14sp

Base.TextAppearance.AppCompat.Button

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

TextAppearance.StatusBar.EventContent.Line2

android:textSize:@dimen/notification_subtext_size

TextAppearance.AppCompat.Notification.Media

android:textColor:@color/secondary_text_default_material_dark

TextAppearance.AppCompat.Notification.Title.Media

android:textColor:@color/primary_text_default_material_dark

TextAppearance.AppCompat.Notification.Info.Media

android:textColor:@color/secondary_text_default_material_dark

TextAppearance.AppCompat.Notification.Time.Media

android:textColor:@color/secondary_text_default_material_dark

Widget.AppCompat.NotificationActionText

android:textColor:@color/secondary_text_default_material_light
android:textSize:@dimen/notification_action_text_size

Base.TextAppearance.AppCompat.Widget.PopupMenu.Header

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_menu_header_material=14sp

Base.Widget.AppCompat.Button.Borderless.Colored

android:textColor:@color/abc_btn_colored_borderless_text_material

Base.TextAppearance.AppCompat

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_body_1_material=14sp

Base.TextAppearance.AppCompat.Display4

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_4_material=112sp

Base.TextAppearance.AppCompat.Display3

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_3_material=56sp

Base.TextAppearance.AppCompat.Display2

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_2_material=45sp

Base.TextAppearance.AppCompat.Display1

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_display_1_material=34sp

Base.TextAppearance.AppCompat.Headline

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_headline_material=24sp

Base.TextAppearance.AppCompat.Title

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_title_material=20sp

Base.TextAppearance.AppCompat.Title.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_title_material=20sp

Base.TextAppearance.AppCompat.Subhead

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_subhead_material=16sp

Base.TextAppearance.AppCompat.Subhead.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_subhead_material=16sp

Base.TextAppearance.AppCompat.Body2

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_body_2_material=14sp

Base.TextAppearance.AppCompat.Body1

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_body_1_material=14sp

Base.TextAppearance.AppCompat.Caption

android:textColor:?android:textColorSecondary
android:textSize:@dimen/abc_text_size_caption_material=12sp

Base.TextAppearance.AppCompat.Menu

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

Base.TextAppearance.AppCompat.Button

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

Base.TextAppearance.AppCompat.Widget.Button

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

Base.TextAppearance.AppCompat.Widget.Button.Inverse

android:textColor:?android:textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_button_material=14sp

Base.TextAppearance.AppCompat.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_body_1_material=14sp

Base.TextAppearance.AppCompat.Large

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_large_material=22sp

Base.TextAppearance.AppCompat.Large.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_large_material=22sp

Base.TextAppearance.AppCompat.Medium

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_medium_material=18sp

Base.TextAppearance.AppCompat.Medium.Inverse

android:textColor:?android:attr/textColorSecondaryInverse
android:textSize:@dimen/abc_text_size_medium_material=18sp

Base.TextAppearance.AppCompat.Small

android:textColor:?android:attr/textColorTertiary
android:textSize:@dimen/abc_text_size_small_material=14sp

Base.TextAppearance.AppCompat.Small.Inverse

android:textColor:?android:attr/textColorTertiaryInverse
android:textSize:@dimen/abc_text_size_small_material=14sp

TextAppearance.AppCompat.Notification.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:14sp

TextAppearance.AppCompat.Notification.Info.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Time.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Title.Media

android:textColor:?android:attr/textColorPrimary
android:textSize:16sp

Base.Widget.AppCompat.ActionBar.TabText

android:textColor:?android:attr/textColorPrimary
android:textSize:12sp

Base.TextAppearance.AppCompat.Widget.ActionMode.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

Base.TextAppearance.AppCompat.Widget.ActionMode.Subtitle

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

Base.TextAppearance.AppCompat.Widget.ActionBar.Menu

android:textColor:?attr/actionMenuTextColor
android:textSize:@dimen/abc_text_size_button_material=14sp

Base.TextAppearance.AppCompat.Widget.ActionBar.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

Base.TextAppearance.AppCompat.Widget.ActionBar.Subtitle

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

Base.TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

Base.TextAppearance.AppCompat.Widget.ActionBar.Subtitle.Inverse

android:textColor:?android:attr/textColorSecondaryInverse
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

Base.TextAppearance.AppCompat.Widget.DropDownItem

android:textColor:?android:attr/textColorPrimaryDisableOnly

Base.TextAppearance.Widget.AppCompat.ExpandedMenu.Item

android:textColor:?android:attr/textColorPrimaryDisableOnly

Base.TextAppearance.AppCompat.Widget.PopupMenu.Large

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

Base.TextAppearance.AppCompat.Widget.PopupMenu.Small

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

Base.TextAppearance.AppCompat.Widget.PopupMenu.Header

android:textColor:?attr/colorAccent
android:textSize:@dimen/abc_text_size_menu_header_material=14sp

Base.TextAppearance.AppCompat.SearchResult

android:textColor:?android:textColorPrimary

Base.TextAppearance.AppCompat.SearchResult.Title

android:textColor:?android:textColorPrimary
android:textSize:18sp

Base.TextAppearance.AppCompat.SearchResult.Subtitle

android:textColor:?android:textColorSecondary
android:textSize:14sp

Base.V7.Widget.AppCompat.AutoCompleteTextView

android:textColor:?attr/editTextColor

Base.TextAppearance.Widget.AppCompat.Toolbar.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

Base.TextAppearance.Widget.AppCompat.Toolbar.Subtitle

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

Base.V7.Widget.AppCompat.EditText

android:textColor:?attr/editTextColor

Base.TextAppearance.AppCompat.Widget.Switch

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_button_material=14sp

Base.Widget.AppCompat.Button.Borderless.Colored

android:textColor:@color/abc_btn_colored_borderless_text_material

Base.TextAppearance.AppCompat.Widget.TextView.SpinnerItem

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

TextAppearance.AppCompat.Widget.ActionBar.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

TextAppearance.AppCompat.Widget.ActionBar.Subtitle

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse

android:textColor:?android:attr/textColorPrimaryInverse
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

TextAppearance.AppCompat.Widget.ActionBar.Subtitle.Inverse

android:textColor:?android:attr/textColorSecondaryInverse
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

TextAppearance.AppCompat.Widget.ActionBar.Menu

android:textColor:?attr/actionMenuTextColor
android:textSize:@dimen/abc_text_size_button_material=14sp

TextAppearance.AppCompat.Widget.ActionMode.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

TextAppearance.AppCompat.Widget.ActionMode.Subtitle

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

TextAppearance.AppCompat.Widget.DropDownItem

android:textColor:?android:attr/textColorPrimaryDisableOnly

TextAppearance.Widget.AppCompat.ExpandedMenu.Item

android:textColor:?android:attr/textColorPrimaryDisableOnly

TextAppearance.AppCompat.Widget.PopupMenu.Large

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

TextAppearance.AppCompat.Widget.PopupMenu.Small

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

TextAppearance.AppCompat.Widget.PopupMenu.Header

android:textColor:?attr/colorAccent
android:textSize:@dimen/abc_text_size_menu_header_material=14sp

TextAppearance.AppCompat.SearchResult.Title

android:textColor:?android:textColorPrimary
android:textSize:18sp

TextAppearance.AppCompat.SearchResult.Subtitle

android:textColor:?android:textColorSecondary
android:textSize:14sp

TextAppearance.Widget.AppCompat.Toolbar.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

TextAppearance.Widget.AppCompat.Toolbar.Subtitle

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

TextAppearance.AppCompat.Light.SearchResult.Title

android:textColor:?android:textColorPrimary
android:textSize:18sp

TextAppearance.AppCompat.Light.SearchResult.Subtitle

android:textColor:?android:textColorSecondary
android:textSize:14sp

TextAppearance.AppCompat.Widget.ActionMode.Title.Inverse

android:textColor:?android:attr/textColorPrimary
android:textSize:@dimen/abc_text_size_title_material_toolbar=20dp

TextAppearance.AppCompat.Widget.ActionMode.Subtitle.Inverse

android:textColor:?android:attr/textColorSecondary
android:textSize:@dimen/abc_text_size_subtitle_material_toolbar=16dp

TextAppearance.AppCompat.Light.Widget.PopupMenu.Large

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

TextAppearance.AppCompat.Light.Widget.PopupMenu.Small

android:textColor:?android:textColorPrimary
android:textSize:@dimen/abc_text_size_menu_material=16sp

TextAppearance.AppCompat.Notification

android:textColor:?android:attr/textColorSecondary
android:textSize:14sp

TextAppearance.AppCompat.Notification.Title

android:textColor:?android:attr/textColorPrimary
android:textSize:16sp

TextAppearance.AppCompat.Notification.Info

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Time

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Line2

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Title.Media

android:textColor:?android:attr/textColorPrimary
android:textSize:16sp

TextAppearance.AppCompat.Notification.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:14sp

TextAppearance.AppCompat.Notification.Info.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Time.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

TextAppearance.AppCompat.Notification.Line2.Media

android:textColor:?android:attr/textColorSecondary
android:textSize:12sp

38
32
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
38
32